7

我有一个关于Angular Google Maps插件的元素。Windows 元素文档中的示例源代码使用元素内部的ng-non-bindable属性。显然，为了让 Angular 绑定在页面上正确呈现，这是必要的。这在文档中没有明确说明，所以我想知道为什么这个属性是必要的，特别是因为关于 ng-non-bindable 的官方 Angular 文档清楚地表明，带注释的 HTML 元素中的 Angular 文字不会被 Angular 解析。<div><ui-gmap-windows>

为了说明，这是我的 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 作为一个整体，更好。

4

1 回答 1

7

基本上这归结为 ui-gmap 手动编译模板。

如果你有类似的东西，在标准角度：

<directive>
   <some-html>{{someBinding}}</some-html>
<directive>

这通常意味着“指令”正在包含内容，因此“someBinding”绑定到“指令”实例化的范围，而不是“指令”内部作用域。

但是，在 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 并绑定到活动标记。

于 2015-01-03T19:01:53.620 回答