0

在我的模態彈出代碼中,我試圖禁用一個按鈕,如果文本框是空的或沒有輸入任何內容。ng-disabled不能正常工作

<div id="add_account_modal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="ModalForAddAccount" aria-hidden="true"> 
    <div class="modal-body"> 
     <h3>Add a new Account</h3> 
     <form class=" " name="addAccountForm"> 
      <div class="control-group"> 
       <div class="controls"> 
        <label class="control-label" style="display: inline"> 
         Account Name 
         <span class="controls" style="display: inline;color:red;">*</span> 
        </label> 

        <div class="controls" style="display: inline"> 
         <input type="text" class="input-large" ng-model="vm.addedAccount" style="margin-top: 5px;margin-left:7px;"> 
        </div> 
       </div> 
      </div> 
      <div class="control-group"> 
       <div class="btn-group"> 
        <button class="btn btn-primary " ng-class="{'disabled':vm.addedAccount === ''}" ng-click="vm.submitAddAccount()">Submit</button> 
        <button class="btn btn-link" data-dismiss="modal" aria-hidden="true">Close</button> 
       </div> 
      </div> 
     </form> 
    </div> 
</div> 

但是模式彈出式加載的提交按鈕沒有被禁用。

我也試過:

<button class="btn btn-primary " ng-disabled="vm.addedAccount === ''" ng-click="vm.submitAddAccount()">Submit</button> 

但也沒有工作。

我在做什麼錯?

回答

1

即使ng-disabled爲真,ng-click也會觸發 改爲使用ng-submit而不是ng-disabled。

<form class=" " name="addAccountForm" ng-submit="vm.submitAddAccount()"> 
     <div class="control-group"> 
      <div class="controls"> 
       <label class="control-label" style="display: inline"> 
        Account Name 
        <span class="controls" style="display: inline;color:red;">*</span> 
       </label> 

       <div class="controls" style="display: inline"> 
        <input type="text" class="input-large" ng-model="vm.addedAccount" style="margin-top: 5px;margin-left:7px;"> 
       </div> 
      </div> 
     </div> 
     <div class="control-group"> 
      <div class="btn-group"> 
       <button type="submit" class="btn btn-primary " ng-disabled="vm.addedAccount === ''">Submit</button> 
       <button class="btn btn-link" data-dismiss="modal" aria-hidden="true">Close</button> 
      </div> 
     </div> 
    </form> 
0

你可以用這種方式:

<button class="btn btn-primary " ng-disabled="!vm.addedAccount.length" ng-click="vm.submitAddAccount()">Submit</button>