Angular.js指令 - 范围。$ on()发射太多次

时间:2014-08-13 22:50:19

标签: angularjs angularjs-directive

在angular.js中,scope.$on正在为我的指令中的私有作用域块中的所有作用域触发。有没有办法让scope.$on()只启动一次?

angular.module('main.vips')
.factory("StatusTrackerService", function($timeout, $rootScope, Restangular) {
    var CHECK_ITERATIONS = 5;
    var TIME_ITERATION = 1000;
    var eventCollection = {};
    eventCollection.vipLabel;

    function urlBuilder(account, eventId) {
        var account = Restangular.one("account", account);
        var eventId = account.one("event", eventId);
        return eventId;
    }

    function NewStatusEvent(account, eventId, url, vipLabel, nodeName) {
        this.iteration = 0;
        this.account = account;
        this.eventId = eventId;
        this.url = url;
        this.vipLabel = vipLabel;
        this.nodeName = nodeName;
    }

    NewStatusEvent.prototype.runCheckLoop = function() {
        this.url.get()
        .then(function(data) {
            if (data.Automation.Status != "SUCCESS") {
            console.log("yes");
            console.log(this.iteration);
            console.log(CHECK_ITERATIONS);

                if (this.iteration < CHECK_ITERATIONS) {
                    this.iteration++;
                    $rootScope.$broadcast("UPDATE", this.account,
                        this.vipLabel, this.nodeName);
                    console.log('-------------------');
                    console.log('checking ' + JSON.stringify(this.url));
                    console.log('iteration ' + this.iteration);
                    console.log('-------------------');
                    $timeout(function (){
                        this.runCheckLoop();
                    }.bind(this), TIME_ITERATION);
                }
            }
        }.bind(this));
    }

    function runEventCheck(account, eventId, nodeName) {
        url = urlBuilder(account, eventId);

        eventCollection[eventCollection.vipLabel] = new NewStatusEvent(account, eventId,
                url, eventCollection.vipLabel, nodeName);
        eventCollection[eventCollection.vipLabel].runCheckLoop();
    }
    return { runEventCheck: runEventCheck,
             eventCollection: eventCollection
    };
});

使用此指令的代码:

         return {
            templateUrl: "vips/directives/action_button.html",
            restrict: "AE",
            replace: true,
            transclude: false,
            scope: {
              label: "@?",
              icon: "@?",
              type: "@?",
              actions: "=?"
            },

        link: function(scope, element, attrs) {
          element.on("click", function(event) {
              var vipLabel = event.currentTarget.id;
              StatusTrackerService.eventCollection.vipLabel = vipLabel;
          });

          scope.$on("UPDATE", function(event, account, 
                      vipLabel, nodeName) {
            console.log('FIRE');
              var nodeSelector = "#node-"+vipLabel+"-"+nodeName;
              var nodeElement = angular.element(document.querySelector(nodeSelector));
              if (!nodeElement.length) {
                  var vipElement = angular.element(document.querySelector('#vipLabel-'+vipLabel));
                  var elementGlobe = '<div id="'+vipLabel+nodeName+'">Yo is Here</div>';
                  vipElement.append(elementGlobe);
              }
          });

更新:这是scope.on()的事件对象:

Object {name: "UPDATE", targetScope: Scope, preventDefault: function, defaultPrevented: false, currentScope: Scope}
 actionButton.js:52
Object {name: "UPDATE", targetScope: Scope, preventDefault: function, defaultPrevented: false, currentScope: Scope}
 actionButton.js:52
Object {name: "UPDATE", targetScope: Scope, preventDefault: function, defaultPrevented: false, currentScope: Scope}
 actionButton.js:52
Object {name: "UPDATE", targetScope: Scope, preventDefault: function, defaultPrevented: false, currentScope: Scope}
 actionButton.js:52
Object {name: "UPDATE", targetScope: Scope, preventDefault: function, defaultPrevented: false, currentScope: Scope}
 actionButton.js:52
Object {name: "UPDATE", targetScope: Scope, preventDefault: function, defaultPrevented: false, currentScope: Scope}
 actionButton.js:52
Object {name: "UPDATE", targetScope: Scope, preventDefault: function, defaultPrevented: false, currentScope: Scope}
 actionButton.js:52
Object {name: "UPDATE", targetScope: Scope, preventDefault: function, defaultPrevented: false, currentScope: Scope}
 actionButton.js:52
Object {name: "UPDATE", targetScope: Scope, preventDefault: function, defaultPrevented: false, currentScope: Scope}
 actionButton.js:52
Object {name: "UPDATE", targetScope: Scope, preventDefault: function, defaultPrevented: false, currentScope: Scope}
 actionButton.js:52
Object {name: "UPDATE", targetScope: Scope, preventDefault: function, defaultPrevented: false, currentScope: Scope}
 actionButton.js:52
Object {name: "UPDATE", targetScope: Scope, preventDefault: function, defaultPrevented: false, currentScope: Scope}
 actionButton.js:52
Object {name: "UPDATE", targetScope: Scope, preventDefault: function, defaultPrevented: false, currentScope: Scope}
 actionButton.js:52
Object {name: "UPDATE", targetScope: Scope, preventDefault: function, defaultPrevented: false, currentScope: Scope}
 actionButton.js:52
Object {name: "UPDATE", targetScope: Scope, preventDefault: function, defaultPrevented: false, currentScope: Scope}
 actionButton.js:52
Object {name: "UPDATE", targetScope: Scope, preventDefault: function, defaultPrevented: false, currentScope: Scope}
 actionButton.js:52
Object {name: "UPDATE", targetScope: Scope, preventDefault: function, defaultPrevented: false, currentScope: Scope}
 actionButton.js:52
Object {name: "UPDATE", targetScope: Scope, preventDefault: function, defaultPrevented: false, currentScope: Scope}
 actionButton.js:52
Object {name: "UPDATE", targetScope: Scope, preventDefault: function, defaultPrevented: false, currentScope: Scope}
 actionButton.js:52
Object {name: "UPDATE", targetScope: Scope, preventDefault: function, defaultPrevented: false, currentScope: Scope}
 actionButton.js:52
Object {name: "UPDATE", targetScope: Scope, preventDefault: function, defaultPrevented: false, currentScope: Scope}

0 个答案:

没有答案