Question

我试图了解AngularJS指令中的范围。从我收集到的有三种类型：

从父控制器继承的范围
子范围（// Bind mouse events to links. container .click(myClickCallback) .mouseenter(myMouseenterCallback) .mouseleave(myMouseleaveCallback); // Click callback. function myClickCallback(e) { var touchOrMouse = $body.touchOrMouse('get', e); // If mouse event has been invoked by touch. if (touchOrMouse === 'touch') { // Toggle .hovered class. list.toggleClass('show-nav'); } // Do not follow the link. e.preventDefault(); } // Mouse enter callback. function myMouseenterCallback(e) { var touchOrMouse = $body.touchOrMouse('get', e); // If mouse event has not been invoked by touch. if (touchOrMouse === 'mouse') { // Add .hovered class. list.addClass('show-nav'); } } // Mouse leave callback. function myMouseleaveCallback(e) { var touchOrMouse = $body.touchOrMouse('get', e); // If mouse event has not been invoked by touch. if (touchOrMouse === 'mouse') { // Remove .hovered class. list.removeClass('show-nav'); } }）
隔离范围（scope: true）

我理解第一个。第二个，'子范围'定义为：

范围原型继承自父控制器

和'isolated scope'定义为

特定于该指令的范围而不是从该指令继承的家长控制器

通俗地说，“儿童范围”和“孤立范围”之间究竟有什么区别？ 他们各自的用例是什么？

Answer 1

关于使用范围的类型，以下是我遵循的一些指导原则。这些知识也阻碍了许多Angular和第三方指令

如果您只需要向现有DOM元素添加一些行为，请使用父作用域，ng-click，ng-show，ng-class就是很好的例子。这些指令没有自己的模板UI，只是扩展了退出html元素的行为。

当指令计划在作用域上添加新属性并且不希望使用此类属性污染父作用域时，请使用scope:true或子作用域。很少有Angular指令执行此操作，ng-repeat为每个迭代元素创建子范围，并在子范围上公开一些属性，如$index。我建议在创建指令时至少创建一个。

使用scope:{}创建的隔离范围由真实组件使用，其中指令的输入通过scope属性显式，并且不受父范围的直接影响。这有助于我们创建一个真正自包含的可重用指令。隔离指令存在一些挑战，例如两个独立的指令不能应用于同一个html元素，您需要注意这一点。

关于范围继承的细微差别，你必须阅读https://github.com/angular/angular.js/wiki/Understanding-Scopes没有出路。

希望它有所帮助。

Answer 2

查看隔离范围的最简单方法可能是查看同一指令的2个实例

<div ng-controller="someController">
    <my-directive>
      <input ng-model ="user.name">
      {{ user.name}}
    </my-directive>
    <my-directive>
      <input ng-model ="user.name">
      {{ user.name}}
    </my-directive>
</div>

没有隔离范围user.name将在父范围内。因此，更改任一实例中的输入也会在另一个实例中更改它，因为它们都引用相同的变量

当隔离范围时，每个实例都有user.name自己的值，一个实例中的更改不会影响另一个实例

Answer 3

当scope设置为“true”时，AngularJS将通过继承父范围来创建新范围。

当scope设置为“false”（或者没有设置任何内容）时，控制器和指令使用相同的范围对象。

当范围：{}时，指令获得一个新的隔离范围。

可以找到详细信息here。

指令中子项和孤立范围之间的差异

3 个答案: