ng-click 将 class 更改为选定的按钮

Question

我想将所选按钮的 class btn-white 更改为 btn-primary

$scope.SelectedCombination = function (combinationId) {
        $scope.selectedCombination =combinationId;
    };

html

<button ng-repeat="combination in combinations" class="btn btn-white" ng-model="" value="{{combination.combinationId}}" ng-click="SelectedCombination(combination.combinationId)"  type="button">{{combination.name}}</button>

Answer 1

使用ng-class。不要使用任何javascript函数来设置css。

<button ng-repeat="combination in combinations" class="btn btn-white" ng-model="x" value="{{combination.combinationId}}" ng-click="SelectedCombination(combination.combinationId);clicked=true;" ng-class="{btn-primary:clicked}" type="button">{{combination.name}}
</button>

或者您可以使用最佳方法：

<button ng-repeat="combination in combinations" class="btn btn-white" ng-model="x" value="{{combination.combinationId}}" ng-click="SelectedCombination(combination.combinationId);" ng-class="{'btn-primary':selectedCombination==combination.combinationId}" type="button">{{combination.name}}
</button>

见plunker

Answer 2

有个东西叫Ng-Class。 Ng-class，允许您通过数据绑定表示所有 class 的表达式在 HTML 元素上动态设置 CSS classes 为 [=13] =]

ng-click 将 class 更改为选定的按钮

ng-click change class to selected button

angularjs

angularjs-ng-click

ng-class