ngClass style with key

我希望有人能幫助我。我正在使用angular v1.3.14，並且嘗試在ng類映射的關鍵字中添加一個作用域變量。ngClass style with key

例如

 <b class="fixedClass" ng-class="{'classOne'  : x === 'foo', 
             'classTwo-%(y)%' : x === 'bar'}"> 
      %(z)% 
     </b>

有沒有辦法做這樣的事情，還是有圍繞一個辦法嗎？

來源

2015-05-07 Kris

你想要做什麼..你想分配一個動態類名 –

我正在創建一個指令，我提供％（y）％[在這種情況下] – Kris

然後我認爲一個更好的選擇將使用像'ng-class =「dynaClass」'這樣的類名變量，然後在'x'上使用watch來更新'dynaclass'的值。 –

你可以做這樣的事情

angular.module('App',[]) 
.controller('AppController',['$scope',function($scope){ 
    $scope.y = 10; 
    $scope.val = 'bar'; 

    var fixedClass = "fixedClass "; 

    $scope.getCSSClass = function(){ 
     if($scope.val === 'foo'){ 
     return fixedClass + 'classOne'; 
     } else { 
     return fixedClass + 'classTwo-(' +$scope.y+ ')'; 
     } 
    }; 
}])

在HTML中

<body ng-controller="AppController"> 
    <b ng-class="getCSSClass()">hello</b> 
</body>

這裏是working代碼

來源

2015-05-07 06:09:39 Sushant

這可行，但isActive（）是恕我直言，壞名字。更好的名字就像'getCssClass（）' –

只是一個例子，我會編輯，如果你想:) – Sushant

是使用控制器會在這裏工作 - 感謝在這裏注意與示例。我仍然更喜歡解決方案，而不使用額外的控制器來解決這個問題:) – Kris

在您的要求來看，似乎你與動態混合靜態類名類名稱。最好的辦法是

ng-class="['fixedClass',' fixedClass2',getDynamicStyle()]"

getDynamicStyle範圍暴露返回動態類名稱的值。您可以添加任意數量的動態樣式。

來源

2015-05-07 06:35:29 Bibin

ngClass style with key

回答

相關問題