AngularJs 条件类和常规类

Question

这是问题所在，我需要应用一个条件类（如果完成为真，则添加'card--done'类），并且还添加存储在task.color中的类。

代码如下：

        <!-- Card -->
        <div class="card" 
            ng-repeat="task in projectsData[currentProject].tasks track by $id(task)"
            ng-class="{'card--done': task.completed}, task.color">
        </div><!-- End of card -->

我

几乎尝试了我能想到的一切，但没有任何东西可以结合起来。

我也尝试了一个功能，仍然不起作用。

ng-class="[getClasses(), {'card--done': task.completed}]"

花了一个半小时，请帮忙:)

Answer 1

你可以这样做：

ng-class="[(task.completed && 'card--done') , task.color]"

如果task.completed是伪造的，它将在元素中添加类名"false"，但它应该是无害的。问题是当你提供一个数组时，它将使用数组中每个项目的字符串表示形式，所以使用一个对象只会显示[Object object]，除非你用括号表示法计算对象，如下所示：

 ng-class="[{true: 'card--done'}[task.completed], task.color]"
 //ng-class="[getClasses(), {true: 'card--done'}[task.completed]]"

普罗提

Answer 2

我无法在ng类中使用模型中的条件和值。

这是我尝试过的：http://jsfiddle.net/walvekarnikhil/jLku2s0c/

<div class="card" 
        ng-repeat="task in tasks"
        ng-class="[task.color,task.status]">
            <h2>{{ task.name }} </h2>                
</div>
var tasks = [ {name:'A',status:'pending',color:'card-red'},
             {name:'B', status:'complete',color:'card-yellow'},
             {name:'C', status:'started',color:'card-blue'}];

我已将状态作为属性添加到任务中，并为这些状态添加了 CSS。