3

在 AngularJS 中使用 controllerAs 语法时，为 ng-click 等定义处理程序的最佳位置是什么？在控制器上还是在作用域上（在链接函数中定义）？

那么，您是否使用：

angular.module('app', []).
    controller('myDirective', function(){
        return {
            template: '<div><button ng-click=vm.onClick()></button></div>',
            controller: function(){
                var vm = this;

                vm.onClick = function(){
                    vm.myValue = vm.doSomethingFancy();
                };

                this.doSomethingFancy = function(){};
            }
        }
    });

或者：

angular.module('app', []).
    controller('myDirective', function () {
        return {
            template: '<div><button ng-click=onClick()></button></div>',
            require: 'myDirecive',
            controller: function () {
                var vm = this;

                this.doSomethingFancy = function () {
                    vm.myValue = 'somethingfancy';
                };
            },
            link: function (scope, elem, attr, ctrl) {
                scope.onClick = function () {
                    ctrl.doSomethingFancy();
                }
            }
        }
    });

我实际上喜欢第二个，因为现在控制器只分配值并且事件处理是在链接函数中完成的。

无论如何......让我知道你的想法是什么。

4

2 回答 2

2

并非都是一成不变的规则，但您可以使用以下内容作为指导：

关注点分离

  • 在控制器中修改模型数据
  • 修改指令中的 DOM/UI

是否对您的模型（在示波器上）doSomethingFancy做一些花哨的事情？- 与控制器一起去。

是否对用户界面doSomethingFancy做一些花哨的事情？-- 带链接去

比赛条件

  • 控制器代码在模板编译之前执行
  • 模板编译后执行链接函数

这并不完全正确：您也可以使用pre链接方法。

常识

如果通过在链接方法中放置一个简单的小函数使代码更具可读性，请使用链接方法。过度设计，仅仅为了遵守一些规则并不是一件好事:) MV* 模式是指导方针。

于 2015-04-10T12:46:31.193 回答
1

长话短说： 没有实际的区别。控制器功能运行较早，但通常没关系。如果您的处理程序没有复杂的逻辑，依赖于外部服务 - 将它们放在链接中，否则 - 控制器更好

长话短说： 有一个类似的问题，得到了更详细的回答：

定义指令时“控制器”、“链接”和“编译”函数之间的区别

于 2015-04-10T12:47:36.610 回答