ng-disabled не работает как ожидалось

Question

В моем модальном всплывающем окне я пытаюсь отключить кнопку, если текстовое поле пустое или ничего не введено в нем.

<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> 

Но это тоже не сработало.

Что я делаю неправильно?

Answer 1

ng-click пожары, даже если ng-disabled is true использовать 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> 

Answer 2

Вы можете использовать этот способ:

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

Answer 3

ng-disabled хорошо работает: http://codepen.io/DaniloPolani/pen/wgOpPa

Может vm.addedAccount это не пустая строка? Попробуйте использовать консольный журнал для печати vm.addedaccount === '' или внутри угловых кронштейнов.