角度范围绑定 &(&) 是一次性绑定吗? [英] Is the angular scope binding &(ampersand) a one time binding?

查看:20
本文介绍了角度范围绑定 &(&) 是一次性绑定吗?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

角度范围绑定 &(&) 是一次性绑定吗?我认为它被称为单向绑定,但它也是一次性的吗?

Is the angular scope binding &(ampersand) a one time binding? I see it referred to as a one-way binding, but is it also one-time?

假设我有:

<my-custom-directive data-item="item" />

我的指令声明如下:

.directive('myCustomDirective', [
'$log', function ($log) {
return {
    restrict: 'E',
    templateUrl: '/template.html',
    scope: {
        dataItem: '&'
    }
    controller: function ($scope) {
        // ....
    }
}])

我之所以问绑定是否是一次性的,是因为这似乎是我正在观察的内容.如果更新了父作用域中的 item,则指令中的那个不会更新.

The reason I'm asking if the binding is one-time is because that seems to be what I'm observing, that is. If item in the parent scope is updated, the one in the directive is not updated.

我说绑定是一次性的对吗?

为了实现我想要的,指令在不影响父作用域的项目的情况下保留一个副本——我这样做了:

To achieve what I want, where the directive keeps a copy without affecting the parent scope's item -- I did this:

.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) {
   //....
   }
}])

这是正确的还是有更好的方法?

Is this proper or is there a better way?

推荐答案

有更好的方法.您当前的解决方案是设置三个手表 - 两个是通过使用="绑定创建的,然后您创建的额外 $watch 用于制作副本.$watches 相对昂贵.

There is a better way. Your current solution is setting up three watches - two are created by using the "=" binding, and then the extra $watch you create to make a copy. $watches are relatively expensive.

这是一个不创建任何手表的替代方案:

Here is an alternative that doesn't create any watches:

.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. 
    }

}])

&被高度误解.虽然它可以用于将函数传递到隔离的作用域中,但它的实际作用是:

& is highly misunderstood. While it can be used for passing functions into an isolated scope, what it actually does is:

提供了一种在父级上下文中执行表达式的方法范围

provides a way to execute an expression in the context of the parent scope

它在指令中生成一个函数,当被调用时,它在父作用域的上下文中执行表达式.表达式不必是函数或函数调用.它可以是任何有效的角度表达式.

It generates a function in the directive that, when called, executes the expression in the context of the parent scope. The expression does not have to be a function or function call. It can be any valid angular expression.

所以在你的例子中:

<my-custom-directive data-item="item"></my-custom-directive>

scope: {
    item: '&'
}

指令中的

$scope.item 将是一个可以在控制器或模板中调用的函数.调用该函数将返回父作用域中item"引用的对象.与 & 没有绑定- 不使用手表.

$scope.item in the directive will be a function that you can call in the controller or in your template. Invoking that function will return the object referenced by "item" in your parent scope. There is no binding with & - no watches are used.

单向绑定"用词不当的地方在于,使用 & 指令不能更改 $parent.item 的值,而在使用="时,指令凭借 $watches创建,可以.它也不是一次",因为它在技术上根本没有限制.

Where the "one-way-binding" misnomer comes in is that using &, the directive cannot change the value of $parent.item, where as when using "=", the directive, by virtue of the $watches created, can. It is also not "one time", either, since it's not technically bound at all.

由于 angular 用于生成函数的机制涉及 $parse,因此指令可以传入locals",用指令中的值覆盖表达式中的值.所以,在指令控制器中,如果你这样做了:

Since the mechanism that angular uses to generate the function involves $parse, it is possible for the directive to pass in "locals" that override values in the expression with values from the directive. So, in the directive controller, if you did:

item({item: 42})

无论父作用域中 item 的值如何,它都会返回 42.正是这个功能使 &对于使用指令中的数据在父作用域上执行函数表达式非常有用.

it would always return 42, regardless of the value of item in the parent scope. It is this feature that makes & useful for executing function expressions on the parent scope with data from the directive.

这篇关于角度范围绑定 &amp;(&) 是一次性绑定吗?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆