如何啓用或禁用基於angularjs中的值的按鈕？

如何根據選擇值啓用或禁用按鈕？我想要一個按鈕被禁用，但是一旦選擇值被更改爲某個值「xxxx」，該按鈕被啓用。如何啓用或禁用基於angularjs中的值的按鈕？

2016-04-25 Saidi Meriem

你試過了什麼？ – silentprogrammer

非常簡單：ngModel + ngDisabled指令。檢查文檔。 – dfsq

使用ng-disableddirective這樣的：

<div class="form-group"> 
    <label class="control-label"> Etat</label> 
    <select class="form-control" name="singleSelect" ng-model="demande.etat"> 
     <option value="etude">etude</option> 
     <option value="Accepte">Accepte</option> 
     <option value="Refus">Refus</option> 
    </select><br> 
</div>

，並在按鈕標記使用這樣的事情：

<button ng-disabled="demande.etat != 'Accepte'"> 
    .... 
</button>

來源

2016-04-25 09:16:49 Adwaenyth

我的angularjs無法識別ng-disabled。 –

@SaidiMeriem你正在使用哪個版本的角？順便說一句。該應用程序不能識別該指令或不會綁定到您的數據？請在您的原始文章中包含您的控制器和html源代碼，以便我們可以看到問題的出現位置。 – Adwaenyth

我正在使用AngularJS v1.4.7，是的應用程序不認識指令 –

使用ngDisabled更多詳情請訪問： https://docs.angularjs.org/api/ng/directive/ngDisabled

使用啓用或禁用選擇框的模型值

後您的代碼，以便可以即興

來源

2016-04-25 09:17:25

-1

可以使用ng-if還爲條件

$scope.MyButton = true; 

<button ng-if="MyButton === false"> 
    .... 
</button>

來源

2016-04-25 09:29:48

這將停止按鈕被渲染。 – anierzad

@anierzad如果你在適當的地方使用ng-if，它會顯示正確的數據以適當的條件 –

但它不回答原始海報提出的問題。 – anierzad

<button class="btn btn-success btn-sm" ng-click="genererContrat(d)" title="Contrat" data-toggle="modal" data-target="#myModalHorizontalContrat" ng-disabled="{demande.etat == Accepte}" ><span class="glyphicon glyphicon-eye-open" ></span><span class="hidden-xs hidden-sm" ></span></button>

來源

2016-04-25 09:43:10

檢查這... 如果你想那麼CHAGE評論。。

angular.module("myApp",[]). 
 
controller("myController",function($scope){ 
 
$scope.buttonShow=false; 
 
    $scope.checkVal=function(){ 
 
    if($scope.demande.etat == "Accepte"){ 
 
     $scope.buttonShow=true; 
 
    }else{ 
 
     $scope.buttonShow=false;  
 
    } 
 
    } 
 
});

<html ng-app="myApp" > 
 
    <head> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
</head> 
 
    <body ng-controller="myController"> 
 
<div class="form-group" > 
 
<label class="control-label"> Etat</label> 
 
<select ng-change="checkVal()" class="form-control" name="singleSelect" ng-model="demande.etat"> 
 
<option value="etude">etude</option> 
 
<option value="Accepte">Accepte</option> 
 
<option value="Refus">Refus</option> 
 
</select><br> 
 
    
 
    <button ng-show="buttonShow" class="btn btn-success btn-sm" ng-click="genererContrat(d)" title="Contrat" data-toggle="modal" data-target="#myModalHorizontalContrat" ><span class="glyphicon glyphicon-eye-open" ></span><span class="hidden-xs hidden-sm" ></span>Button</button> 
 
</div> 
 
    </body> 
 
    </html>

來源

2016-04-25 10:02:47

如何啓用或禁用基於angularjs中的值的按鈕？

回答

相關問題