Question

说我的页面中有以下两个指令：

<todos></todos>
<calendar></calendar>

文件结构设置如下：

/待办事项

待办事项-controller.js
待办事项-directive.js
待办事项-view.html

/日历

日历controller.js
日历directive.js
日历view.html

由于这两个指令在同一级别上是＃34;另一个不包含在另一个中，这不允许我在我的指令中使用require语法在todo控制器中做这样的事情：

CalendarCtrl.foo()

现在我正在使用大量的广播和听众，它变得非常混乱。如何更轻松地在这些之间共享功能并保持我的文件结构相同？

Answer 1

文件/目录结构无关紧要。您的指令文件（calendar-directive.js，todo-directive.js）应该在浏览器上正确加载，您可能会通过index.html（脚本标记）加载它。您必须正确定义模块，其依赖项和指令。例如

angular.module('mainModule', []);

angular.module('mainModule').directive('calendar' ['service1', 'service2', function(service1, service2) {

}]);

angular.module('mainModule').directive('todo' ['service1', 'service2', function(service1, service2) {
return {
restrict: 'AE', 
...
require: '^calendar', 
...
link : function($scope, element, attrs, CalendarCtrl) {
 CalendarCtrl.foo();
}
}
}]);

要在另一个指令中使用该指令，您必须正确使用＆＃39;要求＆＃39;在您的DDO（目录定义对象）中。它的控制器将作为第四个参数注入到你的链接函数中。请注意，这两个指令都在同一个模块中，＆＃39; mainModule＆＃39;，它们的目录结构无关紧要。

Answer 2

如果您只想在两个控制器之间共享一个值，您可以使用服务或工厂进行...

如果要在第一个Controller上调用第二个Controller中的事件，您可以定义一个事件，并通过$ rootScope使用您要发送的数据进行广播。在我的例子中，我的活动名为＆＃39; changeMyEntryEvent＆＃39;和数据是一个字符串＆＃39; myNewEntry＆＃39;。

app.controller('firstController', function ($scope,$rootScope) {

       $rootScope.$broadcast('changeMyEntryEvent', 'myNewEntry');

});

app.controller('secondController', function ($scope,$rootScope) {

       $rootScope.$on('changeMyEntryEvent', function (event, data) {
              //Execute your code on second Controller, triggered by firstController
       });

});

Angular指令通信指令

2 个答案: