爲什麼（form。$ error && form。$提交）在開始時爲true？

這是bug的視頻http://youtu.be/siOfUluPraA 以下是我的代碼。

似乎 NG秀=一瞬間

signinForm真的。$提交=真正的一瞬間

的login.html

<ion-view> 
    <ion-content ng-controller="SignInCtrl"> 
    <div class="login-logo"> 
     <div><h4>LOGIN TO YOUR ACCOUNT</h4></div> 
    </div> 

    <form name="signinForm" novalidate> 
     <div class="list login"> 

     <!-- input username --> 
     <label class="item item-input item-top" 
      ng-class="{'form-has-error' : signinForm.username.$invalid && signinForm.username.$submitted}"> 
      <img src="./img/profile6.png" class= "image-thumb" alt=""> 
      <input type="text" 
        name="username" 
        ng-model="user.username" 
        ng-minlength="5" 
        required placeholder="Name or National Id"> 
     </label> 
     <!-- validation username --> 
     <div class="form-errors" 
       ng-show="signinForm.username.$error && signinForm.$submitted" 
       ng-messages="signinForm.username.$error" 
       ng-messages-include="templates/formerrors/form-errors-username.html"> 
     </div> 

     </div> 
    </form> 
    </ion-content> 
</ion-view>

形式 - 錯誤 - 用戶名.html

<div class="form-error" ng-message="required">This field is required.</div> 
<div class="form-error" ng-message="minlength">This field is must be at least 5 characters.</div>

config.js

app.config(function($stateProvider, $urlRouterProvider) { 
$stateProvider 

.state('signin', { 
    url: '/sign-in', 
    templateUrl: 'templates/login.html', 
    controller: 'SignInCtrl' 
}); 
$urlRouterProvider.otherwise('/sign-in'); 
});

什麼是最佳實踐？在此先感謝！

***** UPDATE *****

我用NG-IF = 「signinForm。$提交」

，而不是NG-表演。

來源

2015-08-09 Ted

當您的應用程序正在加載時，瀏覽器以其原始（未編譯）形式簡要顯示您的HTML模板。

您可以嘗試使用ngCloack以避免閃爍效應。

<div ng-show="form.$submitted" ng-cloak>

來源

2015-08-09 09:38:24 R4c00n

很酷我會試試這個！ – Ted

以下是我固定它，我用

NG-IF = 「signinForm。$提交」

，而不是NG-表演。

來源

2015-08-09 10:01:29 Ted

爲什麼（form。$ error && form。$提交）在開始時爲true？

回答

相關問題