Angular指令 - 如果未设置范围,该怎么办?

时间:2013-10-13 14:24:04

标签: javascript angularjs angularjs-directive angularjs-scope

如果未在Angular指令定义中设置范围,那么范围属性是如何继承的?

Angular docs(在“指令定义对象”下),有两种情况:scopetruescope为对象时{} )。如果范围未设置或为假,该怎么办?在这种情况下,如何为范围及其子项继承属性?

2 个答案:

答案 0 :(得分:2)

当范围在指令定义中设置为false(也是默认值)时,范围的行为会因您是否正在执行transclusion而有所不同。

如果你没有transclude,它几​​乎使用父范围。就像你没有使用指令并直接在页面中编写链接模板一样。

Fiddle

Transclusion总是创建一个子范围,但是当指令范围为false时,它以奇怪的方式绑定到父范围。您可以“读取”父作用域,但只要您“写入”某个属性,它就不再绑定到父作用域的相同属性,而是绑定到子作用域上的属性,除非该属性是对象。

Transcluded Fiddle

Child scope is the ones in green border.

首先尝试更改父作用域。在“var”输入字段中输入一些内容,您将看到子范围的var也将更改。但是当您更改子范围中的var时,它不会更改父范围,并且更改父范围中的var不会影响子范围,因为当您从子范围写入var时,绑定会中断。这不适用于对象(在sp.var上尝试相同,你会发现你无法打破“绑定”)。根据开发人员的说法,这是预期和/或预期的行为。

答案 1 :(得分:1)

如果范围设置为false(默认值),则该指令与父级具有相同的范围 - 不创建新范围。由于它们共享范围,因此父项中的任何更改都将反映在指令中,反之亦然。

由于从封装的角度来看这并不是很好,许多人建议尽可能使用隔离范围(当您将范围设置为{}时隔离范围)