Question

我找不到关于Angular.js的这些信息，我注意到在我工作时这两个值的工作方式不同。有什么区别？

.directive('foo', function() {

  return {
    scope: true
  };
});

.directive('foo', function() {

  return {
    scope: {}
  };
});

Answer 1

scope: true和scope:{}都将为该指令创建子范围。但是，

scope:true将原型继承父级的属性（比如指令所在的控制器），其中scope:{}不会从父级继承属性，因此称为isolated < / p>

例如，假设我们有一个控制器c1和两个指令d1和d2，

app.controller('c1', function($scope){
  $scope.prop = "some value";
});

.directive('d1', function() {
  return {
    scope: true
  };
});

.directive('d2', function() {
  return {
    scope: {}
  };
});

<div ng-controller="c1">
  <d1><d1>
  <d2><d2>
</div>

d1（范围：true）将有权访问c1范围 - ＆gt;支柱，其中d2与c1范围隔离。

注1： d1和d2都会为定义的每个指令创建一个新范围。

注2：除了两者之间的区别，对于scope:true - 对新子范围所做的任何更改都不会反映回父范围。但是，由于新范围是从父范围继承的，因此在c1范围（父范围）中所做的任何更改都将反映在指令范围内。

提示：使用scope:{}或isolated scope获取可重复使用的角度指令。这样你就不会最终搞乱父范围属性

Answer 2

范围：“true”

Angular JS将通过继承父作用域（通常是控制器作用域，否则是应用程序的根作用域）来创建新作用域。

注意：对此新范围所做的任何更改都不会反映回父范围。但是，由于新范围是从父范围继承的，因此在父范围（即控制器）中所做的任何更改都将反映在指令范围内。

范围：“false”

控制器和指令使用相同的范围对象。这意味着对控制器或指令的任何更改都将保持同步。

范围：“{}”

为该指令创建了新范围，但它不会从父范围继承。这个新范围也称为隔离范围，因为它与其父范围完全分离。

Answer 3

范围：true 为从父母继承所有内容的指令创建新范围

范围：{} 还会为该指令创建一个新范围，但它是孤立的，因此它不会从父项继承任何内容

看看这篇文章：

http://www.undefinednull.com/2014/02/11/mastering-the-scope-of-a-directive-in-angularjs/

Answer 4

scope: true创建一个与父作用域不隔离的作用域，它继承父作用域，而scope: {}创建一个与父作用域隔离的作用域。

Answer 5

AngularJS指令中的“范围”声明是“指令定义对象”的属性，它是您定义的指令函数实际返回的属性。 “范围”的选项记录在指令定义对象的官方角度文档中：

https://docs.angularjs.org/api/ng/service/$compile#directive-definition-object

以下是直接从文档中解释的说明：

范围

scope属性可以是false，true或对象：

false （默认值）：不会为该指令创建范围。该   指令将使用其父级的范围。

true ：原型继承自其父级的新子范围   将为指令的元素创建。如果有多个指令   同一个元素请求一个新范围，只创建一个新范围。

{...} （对象哈希）：为其创建一个新的“隔离”范围   指令的模板。 “隔离”范围与正常范围不同   它没有原型继承其父范围。这是   在创建可重用组件时很有用，但不应该   意外地读取或修改父作用域中的数据。注意一个   隔离范围指令没有模板或templateUrl不会   将隔离范围应用于其子元素。

scope：{}和scope：true指令内部有什么区别？

5 个答案:

范围