2016-03-08 79 views
0

我有一個簡單的表單,它將信息註冊到MailChimp的列表中。如果輸入字段尚未填充,我想禁用「提交」按鈕。AngularJS ngDisabled不能在表單中工作

<div class="demo" data-ng-if="demo && !register"> 
        <form action="MAILCHIMP_ADDRESS" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate demoform" data-ng-init="demoUser = {}" target="_blank" autocomplete="off" novalidate> 
         <div class="control-group"> 
          <div class="form-group"> 
           <input type="email" name="EMAIL" data-ng-model="demoUser.email" class="form-control" placeholder="Insira seu e-mail profissional"> 
          </div> 
         </div> 
         <div class="control-group"> 
          <div class="form-group"> 
           <input type="text" name="EMPRESA" data-ng-model="demoUser.empresa" class="form-control" placeholder="Insira sua empresa"> 
          </div> 
         </div> 

         <div style="position: absolute; left: -5000px;" aria-hidden="true"><input type="text" name="b_0a5d36c63e174c949789feea5_200f88e472" tabindex="-1" value=""></div> 
         <div class="clear pull-right"> 
          <button type="submit" class="btn btn-outline-light" data-ng-disabled="mc-embedded-subscribe-form.$invalid" data-ng-click="demoLogin(demoUser)">Enviar</button> 
         </div> 
        </form> 
       </div> 

我在做什麼錯在這裏?

回答

3

這是因爲您在窗體名稱中使用連字符。 其已知問題解釋here也聲明here。 所以你必須改變你的表格名稱到myForm或沒有連字符的東西。

data-ng-disabled="myForm.$invalid" 

檢查這plunker的一個形式與連字符不工作,而另一個則

+0

形式的名稱中破折號不起作用。另一件事是,如果你想讓按鈕保持禁用,你必須檢查表單是否被用戶「觸摸」,並檢查$ pristine。 請查看在視圖中輸出{{myForm}}的內容並查看所有驗證器字段。 – jarasss

+0

仍然無法正常工作。也許ngDisable與表單中的某些內容有衝突? –

+1

哎呀!我忘記將輸入字段標記爲「required」。現在,它的工作原理,我會改變沒有破折號的名稱形式。謝謝! –