AngularJS - $在$开启前发射

时间:2015-11-24 17:27:14

标签: angularjs html5

我正在使用AngularJS框架。我写了几个带有和没有自己的控制器的指令,它们有时会互相包含。

对于每门课程,我都使用自己的指令来打印信息

unordered_map

'on-courses-loaded'属性正在寻找最后一个元素,当ng-repeat结束时,我写了它做的事情:准备了一些数据,并为每个函数寄存器发出信号$ rootScope。$ on('courses_available',function(){})(范围<实际范围)

<li ng-repeat="course in courses" on-courses-loaded="fetch_subscribed">
            <course-info course="course"></course-info>
</li>

在课程信息指令中,调用另一个指令

angular.module('app').directive('onCoursesLoaded', [
    '$rootScope', function ($rootScope) {
            return {
                restrict: 'A',
                link: function (scope, element, attr) {
                     if (scope.$last === true) 
                     {
                         element.ready(function() {
                               // Prepare things, when done return promise and then  -> 
                               $rootScope.$broadcast('courses_available');
                         });
                     }
                }
            }
        }]);

使用此代码

<subscribe code="course.code" triggered="true"></subscribe>

此链接功能

<div ng-show="available">
    <button type="button" class="btn btn-success" ng-hide="subscribed" ng-click="subscribe()">
        <span class="glyphicon glyphicon-ok"></span> Subscribe
    </button>

    <button type="button" class="btn btn-danger" ng-show="subscribed" ng-click="unsubscribe()">
        <span class="glyphicon glyphicon-remove"></span> Unsubscribe
    </button>
</div>

最大的问题是在if (scope.triggered === true) { console.log('wait for emit'); $rootScope.$on('courses_available', function() { internals.getSubscribed(); }); } else { console.log('do not wait for emit'); scope.$watch('code', function(value) { internals.getSubscribed(); }); } 指令设置subscribe之前发出信号

在这里你可以找到扩展的HTML伪代码

$rootScope.$on('courses_available', ..)
  1. 我需要准备数据并在ng-repeat之后发出信号
  2. 1。来自ng-repeat的每个内容都必须订阅$ rootScope。$ on()和emit。之前。
  3. 如果您有任何提示,谢谢大家。     

1 个答案:

答案 0 :(得分:0)

您可以检测ng-repeat的完成事件,如下所示

if (scope.$last){
      window.alert("im the last!");
}

我做过这样的事情,所以我会在这里发布我的代码也许它可以帮助你。首先,我创建了自定义指令

'use strict';

    angular.module('myApp')
      .directive('onFinishRender',['$timeout', function ($timeout) {
        return {
          restrict: 'A',
          link: function (scope, element, attr) {
            if (scope.$last === true) {
              $timeout(function () {
                scope.$emit('tilesCreated');
              });
            }
          }
        }
      }]);

然后将此指令与ng-repeat

一起使用
   <div  on-finish-render=""   ng-repeat="tile in tiles" ></div>

然后我在另一个指令

中侦听这个事件
      scope.$on('tilesCreated', function() {
         // Do something here
      });

P.S。请注意,在这里,我在同一范围内做所有事情。但是如果你想要你可以在$ rootScope上播放事件,这取决于你。我只是想让你了解如何做到这一点。我希望它会有所帮助。