在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}