我找不到有关Angular.js的信息,并且我在工作时注意到这两个值的工作方式不同。有什么不同?
.directive('foo', function() { return { scope: true }; }); .directive('foo', function() { return { scope: {} }; });
两者scope: true和scope:{}都会为指令创建一个子作用域。但,
scope: true
scope:{}
scope:true将从原型继承属性(例如,该指令所在的控制器),而scope:{}不会从父属性继承,因此称为isolated
scope:true
isolated
例如,假设我们有一个控制器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(scope:true)将访问c1范围-> prop,因为d2与c1范围隔离。
注1: d1和d2都将为定义的每个指令创建一个新作用域。
注意2: 除了两者之间的区别外,对于scope:true-对新子作用域所做的任何更改都不会反映回父作用域。但是,由于新作用域是从父作用域继承的,因此对c1作用域(父作用域)所做的任何更改都将反映在指令作用域中。
提示: 将scope:{}或isolated scope用于可重复使用的角度指令。这样您就不会弄乱父范围属性
isolated scope