給伍級一類新的變量值

Question

你好我有如下代碼：

angular.module("myApp", []).controller("myController", function($scope) { 
 
    $scope.fieldSize = "cInputLarge"; //Change for the effect to -> cInputMedium, cInputLarge 
 
});

.cDefault { 
 
    width: 50px; 
 
} 
 
.cInputMedium { 
 
    width: 100px; 
 
} 
 
.cInputLarge { 
 
    width: 200px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="myApp" ng-controller="myController"> 
 
    <input class="cDefault" ng-class="{{fieldSize}}"> 
 
    <br> 
 
    <br>{{fieldSize}} 
 
</div>

我的目標是，以給輸入一個類名，從而改變它的寬度。我知道ng-class是如何與條件一起工作的，但是這樣的事情也是可能的（在ng-class中給出一個類名，並且它的屬性）？

謝謝和歡呼。

Answer 1

只需使用變量名的範圍，就應該足夠：

angular.module("myApp", []).controller("myController", function($scope) { 
 
    $scope.fieldSize = "cInputLarge"; //Change for the effect to -> cInputMedium, cInputLarge 
 
});

.cDefault { 
 
    width: 50px; 
 
} 
 
.cInputMedium { 
 
    width: 100px; 
 
} 
 
.cInputLarge { 
 
    width: 200px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="myApp" ng-controller="myController"> 
 
    <input class="cDefault" ng-class="fieldSize"> 
 
    <br> 
 
    <br>{{fieldSize}} 
 
</div>

Answer 2

是的它是正確的。 您可以綁定到變量

Answer 3

或者試試這個

<input class="cDefault" ng-class="{{'fieldSize'}}">