Question

我怎样才能成功呢？

ng-class="{'a':x, 'b':::y}"

注意我是如何尝试只用“y”绑定一次而不是用“x”

绑定

我也尝试过使用多个ng-class指令，如下所示：

<div ng-class="{'a':x}" ng-class="::{'b':y}"></div>

但也不起作用。

Answer 1

问题是您只能在表达式的开头指定一次性绑定语法::。在这里，表达式是一个对象文字，在第二个键值导致语法无效之前使用::。您必须将它们拆分，并可能在class表达式中放置一个部分（使用2个ng-class指令没有意义）。

示例：

ng-class="{'a':x}" class="someclass {{::{true:'b'}[y]}}"

Documentation

以::开头的表达式被视为一次性表达式。 ....

.a {
  color: green;
}
.b {
  color: blue;
}
.a.b {
  color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script>
<div ng-app>

  <div ng-class="{'a':x}" class="{{::{true:'b'}[y]}}">Test</div>
  X->
  <input type="checkbox" ng-model="x">Y->
  <input type="checkbox" ng-model="y">

</div>

注意：一次性绑定会使监视直到为绑定属性获取非未定义的值。如果属性值在视图渲染时可用（即不是异步），则可以执行

<div ng-class="{'a':x}" class="{{::y ? 'b': ''}}">Test</div>

。

如何使用ng-class绑定一次而不是一次

1 个答案: