我在一个单独的模块"app"和"directiveModule"中分别有一个控制器"MyController"和一个指令"MyDirective".DirectiveModule已被注入"app"的angular.module中.
我遇到的问题是作为"app"的一部分,我有一个控制器发出一个事件"TEST",指令的控制器没有接收.如何成功获取自己模块的指令来捕获发射?这可能吗?(注意:我最初尝试过$ scope,然后使用$ rootScope,但两者都没有区别.)
我的控制器:
app.controller('MyController', function($scope, $rootScope) {
$rootScope.$emit('TEST');
});
Run Code Online (Sandbox Code Playgroud)
我的指示:
directiveModule.directive('MyDirective', ['$rootScope', 'MyService',
function($rootScope, MyService) {
return {
restrict: 'E',
controller: ['$scope', '$rootScope', function($scope, $rootScope) {
$rootScope.$on('TEST', function() {alert("Event Caught")})
}]};
}];
Run Code Online (Sandbox Code Playgroud)
更新:看起来我的指令尚未在广播事件发布时启动.是否有办法让我可以"等待指令实例化"而不是等待"1000"ms的仲裁或其他替代方案?
我认为您的指令需要捕获该事件的唯一情况是根据 获取一些初始数据,因为如果MyController您的指令独立于MyController,则不需要捕获该事件,只需独立启动指令即可。
我的解决方案是使用 $watch 在初始数据准备 就绪时收到通知MyController。
app.controller('MyController', function($scope) {
$scope.data = {}; //initialize the data, this data could be fetched from an ajax
});
directiveModule.directive('MyDirective', ['MyService',
function(MyService) {
return {
restrict: 'E',
controller: ['$scope', function($scope) {
$scope.$watch("data",function(newValue,OldValue,scope){
//do your work here when data is changed.
});
}]};
}];
Run Code Online (Sandbox Code Playgroud)
如果您在指令中使用隔离范围:
directiveModule.directive('MyDirective', ['MyService',
function(MyService) {
return {
restrict: 'E',
scope : {
directiveData:"=",
},
controller: ['$scope', function($scope) {
$scope.$watch("directiveData",function(newValue,OldValue,scope){//watch on the directive scope property
//do your work here when data is changed.
});
}]};
}];
Run Code Online (Sandbox Code Playgroud)
您的 html 可能如下所示:
<my-directive directive-data="data" /> //bind isolate scope directive property with controller's scope property.
Run Code Online (Sandbox Code Playgroud)
我认为以下问题是一些类似的案例:
| 归档时间: |
|
| 查看次数: |
5745 次 |
| 最近记录: |