如何在我的作用域变量完成加载之前延迟ng-init方法？

Question

在我的项目中，我有一个包含多个单元格的表格。在每个单元格中，我有一个带有初始值的下拉菜单。当页面加载时，我调用ng-init中的函数，该函数返回此下拉菜单的正确值。

我的问题是，这个函数依赖于我通过对服务器的异步调用获得的值。这意味着有时（如果表格很大），必要的数据在 ng-init之后加载。这样我无法正确初始化我的下拉菜单。

所以基本上我只需要一种方法来确保在调用ng-init时，已经从服务器接收了所有数据。

通常我会使用$ scope变量来从服务器获取所有数据后更新视图，但我不能在这里做，因为我需要为表中的每个单元格设置一个$ scope变量该表具有动态宽度和高度。

任何想法如何解决这个问题？

以下是我的意思的简短代码示例：

HTML：

<div>
  <md-select ng-model="connectionType"
             ng-init="connectionType = ctrl.getConnectionType(person1.id, person2.id)"
             placeholder=""
             class="md-no-underline">

            <!-- Options -->
 </md-select>

Javascript从服务器加载数据：

dataService.getPersons(curView, function(result) {
  var persons = JSON.parse(result);

  if (persons.length) {

    for (var i = 0;i < persons.length; i++) {
      $scope.persons.push(persons[i]);
        $scope.$apply();
      }
    }
    });

Javascript初始化下拉列表：

self.getConnectionType = function(id1, id2) {

        for (var i = 0; i < $scope.persons.length; i++) {
            if ($scope.persons[i].sourceId === id1&& $scope.persons[i].id2=== activityId) {
                return $scope.persons[i].connectionType;
            }
        }
    };

Answer 1

你可以在桌面上使用带有ng-if =“”的$ scope变量，只有拥有所有数据后才显示它？

Answer 2

根据上面的好评，如果你可以提供帮助，请不要使用ng-init（你可以这样做，因为你可以在实例化后立即初始化你需要的所有内容）。只需将$ scope.persons的init和dropdown connectionType的init结合起来。

.controller("MyCtrl", function() {
  var init = { 
     connectionType: function(id1, id2) {
       angular.forEach($scope.people, function(person) {
         if (person.sourceId == id1 && person.id2 == activityId) {
           $scope.connectionType = person.connectionType;
         }
       });
     },

     people: function() {
       dataService.getPersons(curView).
         then(function(response) {
           // depending on what response brings back, my APIs return a 'data' property for each response
           $scope.people = angular.copy(response.data);

           if ($scope.people.length > 1) {
             var person1 = $scope.people[0],
                 person2 = $scope.people[1];

             // set up the connectionType between person1 and person2
             init.connectionType(person1.id, person2.id);
           }
         });
      }
  }

  // gets called when CTRL is initialized;
  init.people();
})

Answer 3

您可以使用此代码：

angular.element(document).ready(function () {
    $timeout(function () {
        //$scope.init(); Your loading method
    }, 500)

});

您可以在这里调用您的init方法