单击角度引导更改按钮颜色

Question

我有以下内容

<button type="button" class="btn btn-default" ng-click="showMoreFunc('academic')" >Academic</button>
<button type="button" class="btn btn-default" ng-click="showMoreFunc('appliedsciences')" >Applied Sciences</button>

当我们点击+号时,它会给我一个带2个按钮的面板.这些按钮设置为默认值.但是我希望有一个函数可以在每次(活动)时将按钮设置为primaryclicked,并在unclicked单击或按下其他按钮时返回默认值.

我如何实现此功能？

Answer 1

只需使用ng-class,以及您已设置的变量切换显示:

<button type="button" ng-class="{'btn-primary': display.academic}" ng-click="showMoreFunc('academic')" >Academic</button>
<button type="button" ng-class="{'btn-primary': display.appliedsciences}" ng-click="showMoreFunc('appliedsciences')" >Applied Sciences</button>

这是一个有效的演示:http://plnkr.co/edit/cAqxxmaS7pjfhfSgCsWL？p = preview

注意:我试图巩固showMoreFunc函数中的一些逻辑.我认为这很有效,但您的原始代码与ng-class以下内容完美配合:

$scope.showMoreFunc = function(view) {
  $scope.display.appliedsciences = (view == "appliedsciences" && !$scope.display.appliedsciences);
  $scope.display.academic = (view == "academic" && !$scope.display.academic);
}