2016-09-04 6 views
0

私はrc6にアップグレードして、フォームに問題があります。angular2 rc6フォームと検証 - 赤い線が全体のフォームの周りにもあります

1のmin lenを入力し、チェックボックスをクリックすると、検証エラーが表示されます。すばらしいです!しかし、私も全体の形の周りに赤い線ができます。それは恐ろしいね。どうして?私はちょうどvalエラーが強調表示された入力フィールドが必要です。ここで

は私のtsコードです:

以下
myForm: FormGroup; 
constructor(
      private route: ActivatedRoute, 
      private fb: FormBuilder, 
      private _router: Router, 
      private _apiService: ApiService) { 


      this.myForm = fb.group({ 
       name: ['',[Validators.required]] 
      }) 

} 

は私のhtmlコードです:

<div class="row"> 
    <div class="col-md-6 well"> 
     <form [formGroup]="myForm" (ngSubmit)="onSubmit()" autocomplete="off" novalidate> 

      <fieldset> 
       <legend> 
        {{ title }} 
       </legend> 
       <div class="form-group"> 
        <label>Name</label> 
        <input formControlName="name" [(ngModel)]="model.name" type="text" class="form-control" minlength="2"> 
        <div *ngIf="myForm.controls.name.touched && myForm.controls.name.errors"> 
         <div *ngIf="myForm.controls.name.errors?.required" class="alert alert-danger"> 
          Name is required. 
         </div> 

         <div *ngIf="myForm.controls.name.errors.minlength" class="alert alert-danger"> 
          Name should be {{ myForm.controls.name.errors.minlength.requiredLength }} 
         </div> 
        </div> 
       </div> 
      </fieldset> 

     <button [disabled]="!myForm.valid" type="submit" class="btn btn-lg btn-primary-outline"> 
       Next: Intial Model Parameters 
     </button> 

     </form> 
    </div> 
</div> 

答えて

1

私はRC6のように、フォームのDOM要素が子ならば、クラスng-invalidを取得するためであると考えていますコントローラーが無効です。フォーム要素を除外するようにスタイルを更新することで、この問題を解決できるはずです。

関連する問題