angular 范围绑定 &(ampersand) 是一次性绑定吗?
Is the angular scope binding &(ampersand) a one time binding?
angular 作用域绑定 &(&) 是一次性绑定吗?
我看到它被称为单向绑定,但它也是一次性的吗?
假设我有:
<my-custom-directive data-item="item" />
而我的指令声明如下:
.directive('myCustomDirective', [
'$log', function ($log) {
return {
restrict: 'E',
templateUrl: '/template.html',
scope: {
dataItem: '&'
}
controller: function ($scope) {
// ....
}
}])
我之所以问绑定是否是一次性的,是因为我观察到的似乎就是这样。如果更新父作用域中的 item
,则不会更新指令中的
我说绑定是一次性的对吗?
为了实现我想要的,指令在不影响父作用域项的情况下保留副本——我这样做了:
.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) {
//....
}
}])
这样合适还是有更好的方法?
有更好的方法。您当前的解决方案是设置三个手表 - 两个是使用“=”绑定创建的,然后是您创建的额外 $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.
}
}])
& 被严重误解了。虽然它可以用于将函数传递到一个独立的范围,但它实际上做的是:
provides a way to execute an expression in the context of the parent
scope
它在指令中生成一个函数,调用时会在父作用域的上下文中执行表达式。表达式不必是函数或函数调用。它可以是任何有效的 angular 表达式。
所以在你的例子中:
<my-custom-directive data-item="item"></my-custom-directive>
scope: {
item: '&'
}
指令中的 $scope.item 将是您可以在控制器或模板中调用的函数。调用该函数将 return 父作用域中 "item" 引用的对象。没有与 & 的绑定 - 没有使用手表。
"one-way-binding" 用词不当的地方是使用 &,该指令不能更改 $parent.item 的值,而当使用“=”时,该指令凭借 $创造的手表,可以。它也不是 "one time",因为它根本不受技术约束。
由于 angular 用于生成函数的机制涉及 $parse,指令可以传入 "locals",用指令中的值覆盖表达式中的值。所以,在指令控制器中,如果你这样做了:
item({item: 42})
它总是 return 42,无论父范围中的项目值如何。正是这个特性使得 & 对于使用指令中的数据在父作用域上执行函数表达式非常有用。
angular 作用域绑定 &(&) 是一次性绑定吗? 我看到它被称为单向绑定,但它也是一次性的吗?
假设我有:
<my-custom-directive data-item="item" />
而我的指令声明如下:
.directive('myCustomDirective', [
'$log', function ($log) {
return {
restrict: 'E',
templateUrl: '/template.html',
scope: {
dataItem: '&'
}
controller: function ($scope) {
// ....
}
}])
我之所以问绑定是否是一次性的,是因为我观察到的似乎就是这样。如果更新父作用域中的 item
,则不会更新指令中的
我说绑定是一次性的对吗?
为了实现我想要的,指令在不影响父作用域项的情况下保留副本——我这样做了:
.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) {
//....
}
}])
这样合适还是有更好的方法?
有更好的方法。您当前的解决方案是设置三个手表 - 两个是使用“=”绑定创建的,然后是您创建的额外 $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.
}
}])
& 被严重误解了。虽然它可以用于将函数传递到一个独立的范围,但它实际上做的是:
provides a way to execute an expression in the context of the parent scope
它在指令中生成一个函数,调用时会在父作用域的上下文中执行表达式。表达式不必是函数或函数调用。它可以是任何有效的 angular 表达式。
所以在你的例子中:
<my-custom-directive data-item="item"></my-custom-directive>
scope: {
item: '&'
}
指令中的 $scope.item 将是您可以在控制器或模板中调用的函数。调用该函数将 return 父作用域中 "item" 引用的对象。没有与 & 的绑定 - 没有使用手表。
"one-way-binding" 用词不当的地方是使用 &,该指令不能更改 $parent.item 的值,而当使用“=”时,该指令凭借 $创造的手表,可以。它也不是 "one time",因为它根本不受技术约束。
由于 angular 用于生成函数的机制涉及 $parse,指令可以传入 "locals",用指令中的值覆盖表达式中的值。所以,在指令控制器中,如果你这样做了:
item({item: 42})
它总是 return 42,无论父范围中的项目值如何。正是这个特性使得 & 对于使用指令中的数据在父作用域上执行函数表达式非常有用。