Question

我的代码：

<div class="column padding-right-8">
  <button class="btn btn-block btn-long"
          ng-click="swapsCtrl.filters.showLongs = !swapsCtrl.filters.showLongs; swapsCtrl.applyFilters()"
          ng-class="{ 'btn-disabled': !swapsCtrl.filters.showLongs }">Long</button>
</div>
<div class="column padding-left-8">
  <button class="btn btn-block btn-short"
          ng-click="swapsCtrl.filters.showShorts = !swapsCtrl.filters.showShorts; swapsCtrl.applyFilters()"
          ng-class="{ 'btn-disabled': !swapsCtrl.filters.showShorts }">Short</button>
</div>

以上代码效果很好，但它允许用户选择这两个按钮。我的预期行为：

如果选择.btn-long，则.btn-short将获取类.btn-disabled。如果选择了.btn-short，则.btn-long将获取.btn-disabled类。

两个按钮都不可能具有类.btn-disabled，两个按钮也不可能没有.btn-disabled类。

Answer 1

我希望这是你想要的，但是对于 description ，在这个示例中，我尝试使用简单的模型，我们使用scope.long在两个按钮之间切换，如果{{1所以短按钮是long=true，否则长按钮是disabled。

disabled

var app = angular.module("app", []);
app.controller("ctrl", function($scope){
  $scope.long = null;
  $scope.effect = function(type){
    $scope.long = type ? false : true
  }
})

AngularJS如何一次只切换一个按钮

1 个答案: