指令回调和范围

时间:2013-03-03 17:36:32

标签: javascript angularjs angularjs-directive angularjs-scope

我正试图在angularjs中围绕范围,尤其是在使用指令的模块上调用回调时。我找到了3种不同的方法来完成同样的事情,我试图了解每种方法的优缺点。

Given this plnkr

何时使用&=或直接在父级上调用函数是否合适?

我更喜欢使用'='符号绑定,因为指令和托管指令的模块中需要的代码较少,但是according to the documentation(了解Transclusion和Scopes)似乎绑定到回调函数&是首选方法,为什么?

1 个答案:

答案 0 :(得分:7)

好问题。应首先从试图分离您的疑虑的角度做出这些决定。所以我们必须消除在父作用域上调用一个方法 - 该指令必须对父进程有太多了解。

接下来,我们看看目的。根据定义,回调是方法。 &计算父作用域上下文中的表达式,而双向绑定只是一个变量名。 & lot 更强大的功能,为您的指令用户提供了更大的灵活性。当然,他们可以这样做,就像你的例子:

<my-dir cb="callMe()"></my-dir>

但他们也可以这样做:

<my-dir cb="myVar = false"></my-dir>

我们不必传递变量的名称 - 它是任何 AngularJS expression。因此,组件的用户可以以适合他们的任何方式自由地对您的事件做出反应。真棒!

但是,该指令可以对状态变化作出反应。例如,您可以检查条件:

<my-dir cb="myVar"></my-dir>

并且myVar可以评估任何值,并且可以随时更改您的指令并做出相应的反应。您没有共享变量,而是共享表达式。在这种情况下,双向绑定的工作,但如果指令没有(或许不应该)改变的变量,为什么我们需要一个双向绑定?

但同样,它不一定是一个变量。如果表达式的计算结果为true或false?

<my-dir cb="myVar == myOtherVar"></my-dir>

我们的指令,不必在意的如何的父范围到达一个价值 - 只有什么价值最终的

因此我们可以使用它作为父作用域对指令作出反应或使用指令对父作出反应 - 所有这些都使用灵活的表达式。整齐。

因此,=用于确保数据绑定;它确保使用指令的范围和指令本身在某个变量上保持同步。 &允许在父范围的上下文中以及针对该指令或父范围计算表达式来潜在地复杂的状态改变做出反应。