AngularJS从控制器到指令的通信
AngularJS communication from controller to directive
我的问题是关于从控制器到在该控制器上下文中创建的指令的通信。我特别想知道在这种情况下推荐的/最好的方法是什么。我能想到三种不同的可能性:
在指令
使用手表在这种情况下,指令在隔离作用域中设置一个监视变量,并对其变化做出反应:
directive('customDirective', function () {
return {
restrict: 'E',
scope: {
variable: '='
},
link: function (scope, elem, attrs) {
scope.$watch('variable', function (newValue) {
// Do something
});
}
};
});
使用事件对于第二种解决方案,指令使用作用域上的$on函数设置事件处理程序,然后对使用$broadcast函数发送的事件作出反应:
directive('customDirective', function () {
return {
restrict: 'E',
link: function (scope, elem, attrs) {
scope.$on('customEvent', function () {
// Do something
});
}
};
});
使用控件对象
我一直在考虑的最后一个选项是让指令用它打算公开的函数填充控件对象。然后控制器可以在需要的时候调用这个对象的函数:directive('customDirective', function () {
return {
restrict: 'E',
scope: {
controlObject: '='
},
link: function (scope, elem, attrs) {
scope.controlObject.fn = function () {
// Do something
};
}
};
});
controller('customController', function () {
this.controlObject = {};
this.performAction = function () {
this.controlObject.fn();
};
});
<custom-directive control-object="ctrl.controlObject"/>
在这种情况下,哪个被认为是最佳实践?我是不是错过了其他选项?谢谢。
我个人倾向于使用事件。
使用看唯一的缺点(我可以看到)是它引入了一个小的性能影响,并且取决于代码库,小事情最终会累积起来。
使用控件对象
我认为这在指令和控制器之间引入了强耦合。再想象一下,一个项目的新开发者进来,看到this.controlObject.fn()
,他们就像……fn在哪里定义的?然后你开始搜索。
另外,如果你有一个不同的指令需要从控制器知道一些东西,会发生什么?一个新的控制对象,一个定义的新函数…我不喜欢它。
使用事件
使用一个通用命名的事件,如"component"。x更新"你保持耦合到最小,更重要的是,一个新的指令(或模态弹出…
相关文章:
- Angularjs事件与发布/订阅指令之间的通信
- angularjs 中控制器和指令之间的通信
- 正确的方法-Angular JS中指令之间的通信
- AngularJS父指令与子指令通信
- 角度指令父范围和子范围通信
- 从内部指令与主指令的通信 - 调用函数
- 服务和指令之间的通信:依赖关系或或事件
- 指令和控制器之间的双向通信
- 指令和控制器之间的通信,中间作用域介于两者之间
- AngularJS最佳实践 - 指令之间的通信无需$rootScope
- Angular JS-需要与页面上的所有指令进行通信,这些指令来自只运行一次的服务中的代码
- AngularJS 2:如何拥有一个'属性'指令与其主机组件通信
- 在AngularJS中与指令实例通信
- AngularJS指令之间的通信
- 自定义兄弟指令之间的通信
- 父和子指令通信问题
- AngularJS中指令(和其他部分)之间的通信
- AngularJS中控制器和指令之间的通信
- AngularJS指令到指令的通信
- ngClass绑定不通过指令通信更新