何时在 angularJS 中使用双大括号 {{}}

Answer 1

这取决于所讨论的指令属性及其使用的绑定类型。此外，这取决于您在特定情况下的意图。

从你的例子来看：

ng-repeat="appModule in applicationModules"

不需要大括号，因为该表达式是通过 ng-repeat 指令内的 Angular 求值的。

---

id="{{appModule.Name}}"

这里我们需要大括号，因为我们希望 id 等于表达式的值。

---

ng-class="{ 'selected' :  selectedAppModule == '{{appModule.Name}}' }"

我很确定这可以写成：

ng-class="{ 'selected' :  selectedAppModule == appModule.Name }"

你也会得到同样的行为。

---

ng-click="menuClicked(appModule.Name)"

在此示例中，我们需要将 ng-click 绑定到名为 menuClicked 的方法。

---

通常，当我们想要计算表达式时，我们会使用 {{}}，而在处理属性时，我们并不总是需要使用 {{}}，因为它们在许多情况下是在幕后计算的。

简单提示 当需要 {{}} 时，经验法则是将其视为

.ToString()

方法的包装。将表达式转换为字符串是否有意义，那么使用 {{}} 也有意义。 （非常欢迎任何反例）

Answer 2

检查文档。 避免使用插值法

{{ }}

文档说该指令采用表达式 .对于

ng-src

，文档明确指出使用

{{ }}

。如果属性不是 AngularJS 指令，请使用插值。

错误

ng-class="{ 'selected' :  selectedAppModule == '{{appModule.Name}}' }"

上面的例子是混合插值和角度表达的例子。

改为使用：

ng-class="{ 'selected' :  selectedAppModule == appModule.Name }"

来自文档：

为什么混合插值和表达式是不好的做法：

• 它增加了标记的复杂性
• 不能保证它适用于每个指令，因为插值本身就是一个指令。如果另一个指令在插值运行之前访问属性数据，它将获取原始插值标记而不是数据。
• 它会影响性能，因为插值会在范围内添加另一个观察者。
• 由于这不是推荐的用法，因此我们不会对此进行测试，并且对 AngularJS 核心的更改可能会破坏您的代码。

— AngularJS 开发人员指南 - 混合插值和表达式

---

更新

不要使用插值：

• ng-selected

  ，请参阅 AngularJS

  ng-selected

  指令 API 参考

• ng-disabled

  ，请参阅 AngularJS

  ng-disabled

  指令 API 参考

• ng-required

• ng-if

• ng-show

• ng-hide

• ng-open

• ng-value

• ng-repeat

• ng-options