Angular 范围绑定(bind)&(&)是否是一次性绑定(bind)?
我看到它被称为单向绑定(bind),但是它也是一次性的吗?
假设我有:
<my-custom-directive data-item="item" />
我的指令声明如下:
.directive('myCustomDirective', [
'$log', function ($log) {
return {
restrict: 'E',
templateUrl: '/template.html',
scope: {
dataItem: '&'
}
controller: function ($scope) {
// ....
}
}])
我问绑定(bind)是否为一次性绑定(bind)的原因是,这似乎是我正在观察的内容。如果父作用域中的
item
被更新,则指令中的ojit_code不被更新。我说绑定(bind)是一次是对的吗?
为了实现我想要的功能,该指令在不影响父级作用域的项目的情况下保留了副本–我这样做是:
.directive('myCustomDirective', [
'$log', function ($log) {
return {
restrict: 'E',
templateUrl: '/template.html',
scope: {
dataItemOriginal: '='
},
link: function ($scope) {
$scope.$watch('dataItemOriginal', function () {
$scope.dataItem = window.angular.copy($scope.dataItemOriginal);
});
},
controller: function ($scope) {
//....
}
}])
这合适还是有更好的方法?
最佳答案
有个更好的方法。您当前的解决方案是设置三只手表-使用“=”绑定(bind)创建两个手表,然后使用创建的额外$ watch进行复制。 $手表相对昂贵。
这是一种不创建任何手表的替代方法:
.directive('myCustomDirective', [
'$log', function ($log) {
return {
restrict: 'E',
templateUrl: '<div ng-click="clicked()">Click me for current value</div>',
scope: {
item: '&'
},
controller: function($scope) {
$scope.clicked = function(){
alert(item()); //item() returns current value of parent's $scope.item property
}
$scope.val = item(); //val is the initial value of $parent.item
$scope.val = 42; //$parent.item is unaffected.
}
}])
&被高度误解。虽然它可以用于将函数传递到隔离的范围中,但实际上它是:
它在伪指令中生成一个函数,该伪函数在被调用时会在父作用域的上下文中执行表达式。该表达式不必是函数或函数调用。它可以是任何有效的 Angular 表达式。
因此,在您的示例中:
<my-custom-directive data-item="item"></my-custom-directive>
scope: {
item: '&'
}
指令中的$ scope.item将是一个可以在 Controller 或模板中调用的函数。调用该函数将返回父范围内“item”引用的对象。与&不绑定(bind)-不使用手表。
“单向绑定(bind)”用词不正确的地方是使用&,该指令不能更改$ parent.item的值,而当使用“=”时,该指令可以借助创建的$ watches来更改。同样,它也不是“一次性的”,因为它在技术上完全不受限制。
由于angular用于生成函数的机制涉及$ parse,因此该指令有可能传入“本地”,该“局部”会使用该指令中的值覆盖表达式中的值。因此,在指令 Controller 中,如果您这样做:
item({item: 42})
无论父范围中item的值如何,它将始终返回42。正是这一功能使得使用指令中的数据在父作用域上执行函数表达式变得有用。