Question

说我有这个指令：

app.directive('person', function() {
    return {
        restrict: 'E',
        controller: function($scope) {
            $scope.sayHi = function() {
                console.log('hi');
            }

            this.sayBye = function() {
                console.log('goodbye')
            }
        },
        link: function(scope, element, attrs) {

        },
        template: '<p ng-click="sayHi()">Hello</p>'
    }
});

如果点击了该元素，则会调用sayHi()，因为它会附加到$scope，但sayBye方法无效

我的问题：

是从模板调用控制器方法的唯一方法通过将其附加到$ scope来实现？
如果是这样，这不是运行的与其他指令功能相冲突的风险以相同的方式附加到范围或每个指令都有自己的范围？
是附加的唯一理由 this允许其他指令访问这些方法的方法通过require？

我假设最好在可能的情况下保持指令逻辑的封装，所以任何建议都值得赞赏。

Answer 1

是从模板中调用控制器方法的唯一方法将它附加到$ scope？

是。范围是模板和JavaScript之间的代理。

如果是这样，这不会冒与其他指令发生冲突的风险也可以以相同的方式附加到范围的函数每个指令都有自己的范围吗？

是的，存在风险，但范围被定义为父和子范围树，其中第一个发现（从当前范围向上搜索）适用。希望这个场景能够解释我想说的内容：

根据范围
name =“Johnny”
- 儿童

当使用{{ name }}将大子范围附加到模板时，结果将为Jonas，类似地，当子范围附加到具有{{ name }}的模板时，结果将是Jenny。

指令是否创建范围，由其scope属性决定。有关详细信息，请参阅Angular documentation on directives。

是将方法附加到此以允许其他指令的唯一原因通过require访问这些方法？

确切地说，您正在传递构造函数，并且使用this.foo = function () {}您正在实例上定义一个函数，并且该实例与需要它的每个人共享。请注意，在性能敏感的情况下，请注意this.foo = function () {}和Foo.prototype.foo = function () {}之间的区别！

在模板中使用指令控制器方法

1 个答案: