为什么 Angular Google 地图中的 <ui-gmap-windows> 元素需要 ng-non-bindable？
Why is ng-non-bindable required for <ui-gmap-windows> element in Angular Google Maps?
我有一个关于 Angular Google Maps plugin. The example source code in documentation for the Windows element uses the ng-non-bindable attribute for the <div> inside of the <ui-gmap-windows> element. Apparently, this is necessary in order for Angular bindings to render correctly on the page. This is not explicitly stated in the documentation, so I am wondering exactly why this attribute is necessary, especially since the official Angular documentation on ng-non-bindable 的 元素的问题明确指出 Angular 注释中的文字 HTML 元素不会被 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>
然后窗口的文本将正确呈现。它会说类似 "Location 1: This is where Location 1 is."
所以我再一次想知道为什么 ng-non-bindable 在这里是必需的。它将极大地帮助我更好地理解这个 Angular 库，也许 Angular 作为一个整体，更好。
基本上这可以归结为 ui-gmap 手动编译模板。
在标准 angular 如果你有类似的东西：
<directive>
<some-html>{{someBinding}}</some-html>
<directive>
这通常意味着 "directive" 正在包含内容，因此 "someBinding" 绑定到 "directive" 实例化的范围，而不是 "directive" innerScope。
但是，在 ui-gmap 的情况下：
<ui-gmap-windows>
<some-html>{{someBinding}}</some-html>
</ui-gmap-windows>
范围应该是创建的每个 window，而不是 ui-gmap-windows 实例化的范围。因此，如果您没有 ng-non-bindable 那么范围将是 ui-gmap-windows 实例化并且 someBinding 将不存在。
本质上 ui-gmap 是使用被嵌入的元素作为模板来应用于每个实例化的 window 对象，但是如果 angular 进入那里并将该元素绑定到错误的范围，然后 ui-gmap 无法重新绑定到正确的范围。
希望这能为您澄清一点。
另外，您真的不应该使用 ui-gmap-windows，除非您需要同时显示多个 windows。使用单个 ui-gmap-window 并绑定到活动标记。
我有一个关于 Angular Google Maps plugin. The example source code in documentation for the Windows element uses the ng-non-bindable attribute for the <div> inside of the <ui-gmap-windows> element. Apparently, this is necessary in order for Angular bindings to render correctly on the page. This is not explicitly stated in the documentation, so I am wondering exactly why this attribute is necessary, especially since the official Angular documentation on ng-non-bindable 的 元素的问题明确指出 Angular 注释中的文字 HTML 元素不会被 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>
然后窗口的文本将正确呈现。它会说类似 "Location 1: This is where Location 1 is."
所以我再一次想知道为什么 ng-non-bindable 在这里是必需的。它将极大地帮助我更好地理解这个 Angular 库，也许 Angular 作为一个整体，更好。
基本上这可以归结为 ui-gmap 手动编译模板。
在标准 angular 如果你有类似的东西：
<directive>
<some-html>{{someBinding}}</some-html>
<directive>
这通常意味着 "directive" 正在包含内容，因此 "someBinding" 绑定到 "directive" 实例化的范围，而不是 "directive" innerScope。
但是，在 ui-gmap 的情况下：
<ui-gmap-windows>
<some-html>{{someBinding}}</some-html>
</ui-gmap-windows>
范围应该是创建的每个 window，而不是 ui-gmap-windows 实例化的范围。因此，如果您没有 ng-non-bindable 那么范围将是 ui-gmap-windows 实例化并且 someBinding 将不存在。
本质上 ui-gmap 是使用被嵌入的元素作为模板来应用于每个实例化的 window 对象，但是如果 angular 进入那里并将该元素绑定到错误的范围，然后 ui-gmap 无法重新绑定到正确的范围。
希望这能为您澄清一点。
另外，您真的不应该使用 ui-gmap-windows，除非您需要同时显示多个 windows。使用单个 ui-gmap-window 并绑定到活动标记。