的与放大器正确使用;在指令结合 [英] Correct usage of & binding in directives

问题描述

这已经为我在<一个href=\"http://stackoverflow.com/questions/28730684/how-to-pass-either-a-model-or-a-string-to-a-directive-in-angularjs/28731314\">answers和<一个href=\"http://stackoverflow.com/questions/28977158/accessing-particular-directive-scope-from-controller/28977223\">generated一些讨论，我想弄清楚，如果我大错特错，或是否有实现我的目标更加棱角分明的方式。

This has come up for me in answers and generated some discussion and I'd like to figure out if I'm way off base or if there is a "more angular" way to accomplish my goal.

当我写的是要使用隔离范围的指令，即出现一个问题始终是=，＆安培;或@

When I write a directive that is going to use an isolated scope, a question that comes up is always =, & or @.

一般而言，人们总是想起和放大器;作为一种方式来传递功能指令。该文档把它描述为：

Generally, people always think of & as a way to pass functions to directive. The documentation describes it as:

在上下文中执行一个前pression方式
  父范围。如果没有指定ATTR名则属性名称
  被假设为相同的本地名称。给出的范围小部件定义：{
  localFn：'和; myAttr'}，然后隔离scope属性localFn将指向
  一个函数包装为计数=计+值前pression。经常
  它是理想的通过前pression传递从隔离示波器数据
  到母体范围，这可以通过使地图上的地方进行
  变量名和值进入前pression包装FN。例如，
  如果EX pression是增量（量），那么我们可以指定金额
  通过调用localFn作为localFn（{量：22}）值。

a way to execute an expression in the context of the parent scope. If no attr name is specified then the attribute name is assumed to be the same as the local name. Given and widget definition of scope: { localFn:'&myAttr' }, then isolate scope property localFn will point to a function wrapper for the count = count + value expression. Often it's desirable to pass data from the isolated scope via an expression to the parent scope, this can be done by passing a map of local variable names and values into the expression wrapper fn. For example, if the expression is increment(amount) then we can specify the amount value by calling the localFn as localFn({amount: 22}).

我用它传递的功能相当多，但我还用它在情况下，我想通过一个前pression返回一个非字符串，我不希望我的指令能修改父范围值。换句话说，我用它为：

I use it for passing functions quite a bit, but I also use it in cases where I want to pass an expression that returns a non-string, and I don't want my directive to be able to modify values in the parent scope. In other words, I use it as:

在父作用域的上下文中执行一个前pression办法

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

所以，如果我不需要双向绑定，和前pression不是一个字符串，我将做到这一点：

So if I do not need two-way binding, and the expression is not a string, I will do this:

.directive('displayObject', function() {

    scope: {
        value: '&=displayObject'
    },
    template: '<div ng-repeat="(k, v) in value()">{{k}}: {{v}}</div>',
    replace: true,
    ...
});

该指令的用法是：

The directive usage would be:

<div displayObject="someScopePropertyOrExpression"></div>

=，因为我并不需要双向绑定是不理想在这里。我不希望我的指令修改父范围的价值，我不希望维持它所需要的手表。

= isn't ideal here because I do not need two way binding. I don't want my directive modifying the value in the parent scope and I don't want the watch required to maintain it.

@因为它内插属性，因此值将始终是一个字符串，是不理想的。

@ isn't ideal because it interpolates the attribute, so value would always be a string.

:: someScopePropertyOrEx pression不工作，因为我想，如果它改变了指令模板，以反映someScopePropertyOrEx pression变化。

::someScopePropertyOrExpression doesn't work because I want the directive template to reflect changes in someScopePropertyOrExpression if it changes.

在每次讨论，它总是长大了

In each discussion, it's always brought up that

ng-repeat="(key, value) in value()"

建立一个表 - 的问题是，=和模板一起建立了两个 - 一个是完全不必要的。

sets up a watch - the problem is that = and the template together set up two - one that is wholly unnecessary.

有几次当我提出这个模式它被称为黑客，或与功放滥用;，甚至是丑。

Several times when I've suggested this pattern it's been called a "hack", or a misuse of &, and even "ugly".

我不认为这是任何这些，但如果是，那么我的具体问题是什么是另类？

I don't think it is any of these, but if it is, then my specific question is what is the alternative?

推荐答案

我已经搜查了不少，证明你在我们的<错误href=\"http://stackoverflow.com/questions/28730684/how-to-pass-either-a-model-or-a-string-to-a-directive-in-angularjs/28731314\">discussion这里，但我认为你是对的 - 这是建立一个单向的（从父隔离范围内）绑定到一个实际的模型的唯一方法。

I've searched quite a bit to prove you wrong in our discussion here, but I think you are right - this is the only way to set up a one-way (from parent to isolate scope) binding to an actual model.

在这方面＆放大器;优于=，因为，正如你提到的，=设置父的范围手表，而＆放大器;不

In that aspect "&" is superior to "=", because, as you noted, "=" sets up a watch on the parent's scope whereas "&" does not.

一件事 - plunker 1 - （我终于揭开）上它是一个黑客暗示的是，它没有发挥好有角度的一次性结合富=::名：

One thing - plunker 1 - (that I finally managed to uncover) that hints on it being a hack is that it does not play nice with Angular's one-time binding foo="::name":

=将信守一次性绑定（它设置了一个手表父和下消化之前将其），而＆放大器;不会

"=" will honor the one-time binding (it sets up a watch on the parent and removes it before the next digest), whereas "&" would not:

<input ng-model="name">
<div two-way="::name">
<div one-way="::name">

另外一件事 - plunker 2 - 是＆放大器;可通过局部变量，它们可能阴影外变量：

The other thing - plunker 2 - is that "&" allows to pass local variables, and they may shadow outer variables:

<input ng-model="name">
<div one-way="name">

但在该指令，如果你不喜欢的东西：{{单向（{名称：'fooo'}）}}，这将导致其显示fooo，而不是从外部范围采取名称的价值。
这是一个有点像搬起石头砸自己的脚，是的，但它确实暗示，这种用法可能它的原意之外稍定。

But in the directive if you did something like: "{{oneWay({name: 'fooo'})}}", it will cause it to display "fooo", rather than take the value of name from the outer scope. It's a bit like shooting yourself in the foot, yes, but it does hint that this usage might be slightly outside of its original intent.

这篇关于的与放大器正确使用;在指令结合的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！