Question

我有一种情况，我必须根据条件添加类，并且ng-class正在根据它工作，即使ng-class中的条件为真。

<ul id="" class="clowd_wall" dnd-list="vm.cardData[columns.id].data" 
            dnd-drop="vm.callback(item,{targetList: vm.cardData[columns.id].data, targetIndex: index, event: event,item:item,type:'folder',eventType:'sort','root':'folder',current_parent:'folder'})" ng-model="vm.cardData[columns.id].data">
               <div class="emptyCol" ng-if="vm.cardData[columns.id].data.length==0">Empty</div>
              <li class="dndPlaceholder"></li>
              <li class="cont____item" ng-repeat="card in vm.cardData[columns.id].data | orderBy:vm.sort" dnd-draggable="card"
         dnd-effect-allowed="move"
        dnd-allowed-types="card.allowType"
        dnd-moved="vm.cardData[columns.id].data.splice($index, 1)"
        dnd-selected="vm.tree.selected = card"  ng-class="{emptyCard:card.data.length==0,zoomin:vm.zoomin=='zoomin',emptyCard:!card.data}">
                 <div class="item" style="height:79%">
                    <ng-include ng-init = "root = columns.id" src="'app/partials/card.html'"></ng-include>
                 </div>
              </li>
           </ul>

Answer 1

你的问题不明确，因为我们不知道card.data会包含什么，以及＆＃34; .data＆＃34;每次迭代都会出现

如果是数组那么这将起作用＆＃34; card.data.length＆＃34;如果没有＆＃34;数据＆＃34;键入＆＃34; card＆＃34;然后＆＃34; .length＆＃34;将通过错误，即如果card.data本身未定义，那么它将没有＆＃34;长度＆＃34;属性。

尝试逐个添加ng-class中的条件，然后你就可以找出导致问题的条件。

Answer 2

做了一些小改动

ng-class="{emptyCard: card.data.length==0 || !card.data,zoomin: vm.zoomin=='zoomin'}"

如果您有多个表达式，请尝试老式，如果它看起来最好：

<强>控制器：

$scope.getcardClass = function (objCard, strZoomin) {
    if (!card.data) {
        return 'emptyCard';
    } else if (strZoomin =='zoomin') {
        return 'zoomin';
    } else if (card.data.length == 0) {
        return 'emptyCard';
    }
};

<强> HTML ：

ng-class="vm.getcardClass(card, vm.zoomin)"

注意：将vm替换为您的控制器对象。

ng-class不使用ng-repeat

2 个答案: