我有一个关于 Angular Google Maps插件的元素。Windows元素的文档中的示例源代码将ng-non-bindable
属性用于<div>
该<ui-gmap-windows>
元素的内部。显然,这是使Angular绑定正确显示在页面上所必需的。这在文档中没有明确说明,所以我确切地想知道为什么需要此属性,尤其是因为有关ng-non-bindable的正式Angular文档明确指出带注释的HTML元素中的Angular文字不会被Angular解析。
为了说明这一点,这是我的HTML部分中的代码片段(假定此Windows元素作用域中的属性模型具有名称和描述字段):
<ui-gmap-markers models="markers" coords="'self'">
<ui-gmap-windows>
<div>{{name}}: {{description}}</div>
</ui-gmap-windows>
</ui-gmap-markers>
如果没有ng-non-bindable
作为的属性<div>
(或没有div),则模型的值将不会绑定到这些Angular文字。只是冒号将在窗口中呈现,如“:”所示。但是,一旦我输入了属性:
<ui-gmap-markers models="markers" coords="'self'">
<ui-gmap-windows>
<div ng-non-bindable>{{name}}: {{description}}</div>
</ui-gmap-windows>
</ui-gmap-markers>
那么窗口的文本将正确呈现。它将显示类似“位置1:这是位置1所在的位置”的信息。
因此,我再次想知道为什么这里确实需要ng-non-bindable。这将极大地帮助我更好地理解这个Angular库,也许更好地理解整个Angular。
基本上,这可以归结为ui-gmap进行模板的手动编译。
在标准角度下,如果您有以下情况:
<directive>
<some-html>{{someBinding}}</some-html>
<directive>
这通常意味着“指令”正在包含内容,因此“ someBinding”绑定到实例化“指令”的范围,而不是“指令” innerScope。
但是,对于ui-gmap:
<ui-gmap-windows>
<some-html>{{someBinding}}</some-html>
</ui-gmap-windows>
范围应该是创建的每个窗口的范围,而不是ui-gmap-windows实例化的范围。因此,如果您没有ng-non-bindable,则范围将是ui-gmap-windows实例化,并且someBinding将不存在。
从本质上讲,ui-gmap使用了已包含元素的模板作为应用于每个实例化窗口对象的模板,但是如果angular进入那里并将该元素绑定到错误的作用域,则ui-gmap无法重新绑定到正确的作用域。
希望能为您澄清一下。
另外,除非需要同时显示多个窗口,否则您实际上不应该使用ui-gmap-windows。使用单个ui-gmap-window并绑定到活动标记。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句