ng级一次性绑定答案

【问题标题】：ng-class one time bindingng级一次性绑定
【发布时间】：2015-09-24 17:01:26
【问题描述】：

我想知道是否有可能有一个 ng-class 与 class one time 绑定和 class 在每个摘要循环中评估。

<div ng-class="{'one_time_binded_class': isMonkey(), 'not_one_time_binded_class': isUnicorn()}"></div>

我知道我可以一次将完整的 ng-class 绑定到 ng-class="::{...}" 但我需要一次绑定一个特定的表达式

当然，这东西不行：

<div ng-class="{'my_static_class': ::isMonkey(), 'my_dynamic_class': isUnicorn()}"></div>

有办法吗？

【问题讨论】：

标签： angularjs class

【解决方案1】：

方法一：

class="some-class {{::expression ? 'my-class' : ''}}"

方法二：

ng-class="::{'my-class': expression}"

【讨论】：

【解决方案2】：

我能想到的一种方法（如果我按照你想说的话）如下......

.blue{
    color: blue;
}
.underline{
    text-decoration: underline;
}
.lineThrough{
    text-decoration: line-through;
}

<div ng-app ng-controller="myCtrl">
    <p ng-class="{'blue': isMonkey()}" class="{{isUnicorn() ? dynamicClass: ''}}">My Text</p>
    <button ng-click="monkey = !monkey">Monkey</button>
    <button ng-click="unicorn = !unicorn">Unicorn</button>
    <button ng-click="toggleClass()">Toggle</button>
</div>

function myCtrl($scope) {
    $scope.dynamicClass = "underline";
    $scope.monkey = true;
    $scope.unicorn = true;
    $scope.isMonkey = function () {
        return $scope.monkey;
    }
    $scope.isUnicorn = function () {
        return $scope.unicorn;
    }
    $scope.toggleClass = function(){
        $scope.dynamicClass = $scope.dynamicClass === "underline"? "lineThrough": "underline";
    }
}

JSFiddle

【讨论】：

感谢您的回答，但我的问题是关于一次性绑定。 'my_static_class' 的表达式被评估一次，'my_dynamic_class' 的表达式在每个摘要循环中被评估。类名选错了对不起...

【解决方案3】：

一次性绑定的一个重要部分是它不会被绑定，直到“表达式”不是未定义的。到目前为止，@ifadey 给出的最佳答案是，当“表达式”未定义时，他的方法 1 计算为一个空字符串，这是绑定的。这与预期的特征行为相反。方法 2 在这种后期绑定场景中同样没有帮助。

这样做正确，直接回答op的问题：

class="some-class {{::expression ? 'one-time-class' : undefined}}"
ng-class="{ 'my-dynamic-class' : expression2 }"

或更技术上正确但丑陋的：

class="some-class {{::expression ? 'one-time-class' : (expression===undefined ? undefined : '')}}"

【讨论】：