Page 29 - AngularJS权威教程
P. 29

2.3  数据绑定的最佳实践    9


                  如果把这个最佳实践应用到上面时钟的例子中,需要把视图中的代码改写成下面这样:                                             1

                  <!doctype html>
                  <html ng-app>
                    <head>                                                                           2
                      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.js"></script>
                    </head>
                    <body>                                                                           3
                      <div ng-controller="MyController">
                        <h1>Hello {{ clock.now }}!</h1>
                      </div>
                      <script type="text/javascript" src="js/app.js"></script>                       4
                     </body>
                  </html>
                                                                                                     5
                  在这个例子中,相比每秒钟都更新$scope.clock,更新clock.now的值会是更好的选择。有
              了这个优化后,我们将反映数据变化的逻辑做如下修改:
                                                                                                     6
                  // 在app.js中
                  function MyController($scope) {
                      $scope.clock = {                                                               7
                          now: new Date()
                      };
                      var updateClock = function() {
                          $scope.clock.now = new Date()                                              8
                      };
                      setInterval(function() {
                          $scope.$apply(updateClock);                                                9
                      }, 1000);
                      updateClock();
                  };
                                                                                                     10

                          将所有绑定都通过这样的形式放在视图中,是个非常好的主意。
                                                                                                     11


                                                                                                     12


                                                                                                     13


                                                                                                     14



                                                                                                     15


                                                                                                     16


                                                                                                     17


                                                                                                     18
   24   25   26   27   28   29   30   31   32   33   34