當我按下angularjs中的一個按鈕時，如何禁用其他按鈕

有沒有可能以角度做到這一點？當我按下一個按鈕元素時，其他按鈕元素會自動禁用。我看到了一個類似的問題，但在純粹的angularjs中尋找這個問題。當我按下angularjs中的一個按鈕時，如何禁用其他按鈕

<html ng-app> 
    <button ng-model="button" > abc </button> 
    <button ng-disabled="button"> def </button> 
    <button ng-disabled="button"> ghi </button> 
</html>

來源

2016-01-05 Deke

可以綁定一個ng-click事件，所有這三個按鈕，通過標識的功能（即按鈕的id。然後你的函數將一個變量綁定到的範圍，然後你可以使用以確定是否ng-disabled應進行或不

例如，在你的控制器，你將有類似的東西：

$scope.selectedButton; 

    $scope.selectButton = function(id) { 
     $scope.selectedButton = id; 
    }

然後，在你的HTML，你將修改它拿在ng-click和ng-disabled考慮上述。

<html ng-app ng-controller="SomeController"> 
    <button ng-disabled="selectedButton && selectedButton != 'abc'" ng-click="selectButton('abc')">abc</button> 
    <button ng-disabled="selectedButton && selectedButton != 'def'" ng-click="selectButton('def')">def</button> 
    <button ng-disabled="selectedButton && selectedButton != 'ghi'" ng-click="selectButton('ghi')">ghi</button> 
</html>

筆記，檢查是否selectedButton和selectedButton不等於foo的邏輯，是確定按鈕已經被選擇，因此該變量被設置爲範圍。

來源

2016-01-05 21:23:14

謝謝大家。我喜歡這個答案。 – Deke

簡單，純粹的角度方式。

<html ng-app> 
    <button ng-click="buttonsDisabled = true"> abc </button> 
    <button ng-disabled="buttonsDisabled"> def </button> 
    <button ng-disabled="buttonsDisabled"> ghi </button> 
</html>

http://jsfiddle.net/HB7LU/21811/

來源

2016-01-05 21:27:02

此解決方案只適用於一個按鈕... –

作者沒有說它應該適用於每個按鈕。看看他的例子。「One button」和「Any button」有區別。 –

<html ng-app="yourApp"> 
    <body ng-controller="buttonCtrl"> 
    <button ng-disabled="!button1" ng-click="toggleFunction(1)" > abc </button> 
    <button ng-disabled="!button2" ng-click="toggleFunction(2)" > abc </button> 
    <button ng-disabled="!button3" ng-click="toggleFunction(3)" > abc </button> 
    </body> 
</html> 

<script> 

yourApp.controller('buttonCtrl', ['$scope', function($scope) { 
    function toggleFunction(activeBtn){ 
     if (activeBtn == 1){ 
      $scope.button1 = true; 
      $scope.button2 = false; 
      $scope.button3 = false; 
     } else if (activeBtn == 2){ 
      $scope.button1 = false; 
      $scope.button2 = true; 
      $scope.button3 = false; 
     } else if (activeBtn == 3){ 
      $scope.button1 = false; 
      $scope.button2 = false; 
      $scope.button3 = true; 
     } 
    } 
}]); 
</script>

來源

2016-01-05 21:32:23 MiVvlt

你可以像下面這樣做

<script> 
var app=angular.module('myApp', []); 
app.controller('someCtrl',function($scope){ 
    $scope.mySwitch=true; 
    $scope.toggle=function(){ 
    $scope.mySwitch=!$scope.mySwitch; 
    }; 
}); 
</script> 
<div ng-app="myApp"> 
    <div ng-controller="someCtrl"> 
    <p> 
     <button ng-click="toggle()">abc</button> 
    </p> 
    <p> 
     <button ng-disabled="mySwitch">def</button> 
     <button ng-disabled="mySwitch">ghi</button> 
    </p> 
    </div> 
</div>

來源

2016-01-05 21:47:53 gkocyigit

當我按下angularjs中的一個按鈕時，如何禁用其他按鈕

回答

相關問題