模型绑定或 ng-repeat 完成时的 AngularJS 事件? [英] AngularJS event for when model binding or ng-repeat is complete?

问题描述

我们有一个大型模型，ng-repeat 将模型中的所有项目绑定到表单需要几秒钟的时间.我们想在发生这种情况时展示一个微调器.绑定完成后是否会触发某些事件，以便我们知道何时隐藏微调器?

解决方案

Plunkr: http://plnkr.co/edit/GzzTW4?p=预览

在微调器上使用 ng-show 如果您使用的是 1.2，请使用 ng-if

<div ng-show="complete">Complete={{complete}}</div><div class="thing" ng-repeat="事物中的事物" my-post-repeat-directive>东西{{东西}}

在您的指令中，使用 $last 来确定渲染是否完成，然后更改您定义了 ng-show/ngif 的变量.

function Ctrl($scope) {$scope.complete=false;$scope.doComplete = function() {$scope.complete = true;}$scope.things = ['A'、'B'、'C'];}angular.module('myApp', []).directive('myPostRepeatDirective', function() {返回函数(范围，元素，属性){如果(范围.$last){scope.$eval('doComplete()');}};});

We have a large model and it takes a couple seconds for ng-repeat to bind all the items in the model to the form. We would like to show a spinner while it this is happening. Is there some event that fires when binding is complete so we know when to hide the spinner?

解决方案

Plunkr: http://plnkr.co/edit/GzzTW4?p=preview

Use ng-show on the spinner If you are using 1.2 use ng-if

<div ng-controller="Ctrl">
    <div ng-show="complete">Complete={{complete}}</div>
    <div class="thing" ng-repeat="thing in things" my-post-repeat-directive>
       thing {{thing}}
   </div>
</div>

In your directive use $last to determine if rendering is done and then change the variable that you have the ng-show/ngif defined on.

function Ctrl($scope) {
  $scope.complete=false;  
  $scope.doComplete = function() {
      $scope.complete = true;
  }

  $scope.things = [
    'A', 'B', 'C'
  ];
}

angular.module('myApp', [])
  .directive('myPostRepeatDirective', function() {
    return function(scope, element, attrs) {
      if (scope.$last) {
        scope.$eval('doComplete()');
      }
    };
  });

这篇关于模型绑定或 ng-repeat 完成时的 AngularJS 事件?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！