ng級有條件不起作用

Question

我有一個名爲fund的角度指令。該指令定義如下。

return{ 
    restrict: 'E', 
    replace: true, 
    scope: { 
    data: '=', 
    cut: '@' 
    }, 
    templateUrl: 'app/directives/partials/fund.jsp' 
} 

它有一個名爲cut的屬性。如果設定了剪裁，我將申請text-cut課程，如果沒有設置，則不設課程。類是在需要的情況如下：

.text-cut{ 
    overflow: hidden; 
    text-align: left; 
    text-overflow: ellipsis 
} 

我曾嘗試使用下面的指令爲：

<fund data="myCtrl.fundList" cut="true"></fund> 

<fund data="myCtrl.fundList" cut="'true'"></fund> 

與以下納克級的模板屬性：

ng-class="text-cut: cut" 
ng-class="text-cut: 'cut'" 
ng-class="{text-cut: cut}" 
ng-class="{text-cut: 'cut'}" 
ng-class="text-cut: cut===true" 
ng-class="text-cut: 'cut'===true" 
ng-class="{text-cut: cut===true}" 
ng-class="{text-cut: 'cut'===true}" 

但這些組合中沒有一個將text-cut類應用於我的基金指令。錯誤在哪裏？

Answer 1

你必須引用text-cut。嘗試

ng-class="{'text-cut': cut}" 

Answer 2

創建一個函數，該函數根據某些條件返回所需的字符串類。然後在你的ng類中調用它。只要該函數返回你想要的CSS它應該工作。

$scope.checkCut = function(){ 
    if(this.cut != null){ 
     return 'text-cut'; 
    } 
} 

在你的指令

ng-class="checkCut"