Question

我对aj很新。下面是我的角度js代码。我在controller中创建字典列表。我从ui调用控制器函数add（），如下所示：

   <html>
    <head>

          <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css">
          <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
          <script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
          <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script>
       </head>

       <body>
          <div ng-app="appTable">
             <div ng-controller="Allocation">
             {{ add()}}
             {{dataList}}
             </div>
          </div>
       </body>
    <script>
        var app = angular.module("appTable", []);

        app.controller("Allocation", function($scope, $http) {
            $scope.dataList = [];
            $scope.add = function() {
                var data = {};
                data = {
                    "date": '11'
                };
                $scope.dataList.push(data);
            };
        });
    </script>
    </html>

输出是：

[{"date":"11"},{"date":"11"},{"date":"11"},{"date":"11"},{"date":"11"},{"date":"11"},{"date":"11"},{"date":"11"},{"date":"11"},{"date":"11"}]

但根据我的理解输出应该是，

[{"date":"11"}]

请帮忙。

Answer 1

页面加载时，只能使用ng-init调用一次函数。见：

＆＃13;

        var app = angular.module("appTable", []);

        app.controller("Allocation", function($scope) {
            $scope.dataList = [];
            $scope.add = function() {
                var data = {};
                data = {
                    "date": '11'
                };
                $scope.dataList.push(data);
            };
        });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
       <body>
          <div ng-app="appTable">
             <div ng-controller="Allocation">
             <span ng-init="add()"></span>
             {{dataList}}
             </div>
          </div>
       </body>
  
    </html>

＆＃13;

Answer 2

当您直接在页面加载上调用任何事件时，它将转到无限$ digest（）循环。

当应用程序的模型变得不稳定并且每个$摘要周期触发状态更改和随后的$摘要周期时，会发生此错误。 AngularJS检测到这种情况，阻止无限循环导致浏览器无响应。

Answer 3

如果您不想要任何活动。您可以使用自动调用功能并从HTML中删除 {{add（）}}

  $scope.add = function() {
         var data = {};
         data = {
                 "date": '11'
         };
         $scope.dataList.push(data);
   }();

Angularjs多次打印列表元素

3 个答案: