3

假设我有这个指令：

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方法不起作用

我的问题：

  1. 是通过将模板附加到 $scope 来实现从模板调用控制器方法的唯一方法吗？

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

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

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

4

1 回答 1

4

是通过将模板附加到 $scope 来实现从模板调用控制器方法的唯一方法吗？

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

如果是这样，这是否存在与其他指令函数发生冲突的风险，这些指令函数也可以以相同的方式附加到范围，或者每个指令都有自己的范围？

是的，这种风险是存在的，但是作用域的定义就像父作用域和子作用域树一样，其中找到的第一个作用域（从当前作用域向上搜索）适用。希望这个场景能解释我想说的：

  • 根范围
  • 名称=“约翰尼”
    • 孩子
    • 名称=“珍妮”
      • 大孩子
      • 名称=“乔纳斯”

当大子作用域用 附加到模板时{{ name }}，结果将是Jonas，类似地，当子作用域用 附加到模板时{{ name }}，结果将是Jenny。

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

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

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

于 2013-09-05T13:07:23.677 回答