角2 - 表单在第二次提交空值

Question

@Component({ 

    template: ` 
     <form [formGroup]="formGroup" (ngSubmit)="onSubmit()" novalidate> 
      <textarea name="detail" id="detail" formControlName="detail"></textarea> 
      <div *ngIf="formGroup.controls['detail'].dirty && formGroup.controls['detail'].invalid">This is required</div> 
      <button type="submit" >Post</button> 
     </form> 
    `, 

}) 
export class CreateDiscussionComponent { 
    formGroup: FormGroup; 
    submitted: boolean = false; 
    constructor(
    ) { 
     this.formGroup = new FormGroup({ 
      detail: new FormControl('', [Validators.required, Validators.minLength(2) ]), 
      type : new FormControl('discussion'), 
      userPosts: new FormControl([]) 
     }); 
    } 
    onSubmit(): void { 
     console.log('form data', this.formGroup.value) 
     this.submitted = true; 
     this.formGroup.reset() 
    } 
} 

使用此代码。当我提交形成我第一次在控制台

{ 
    detai: 'my text' 
    type: 'discusion' 
    userPosts: [] 
} 

第二次，每一次得到这个对象，我得到这个

{ 
    detai: 'my text' 
    type: null 
    userPosts: null 
} 

后，我期待type = discussion和userposts = []

Answer 1

复位方法FormGroup不会将值重置为您的预定义值，它会重置为null并重置状态（原始，未触及）。要重置预定义值状态，你必须重新设置的值是这样的：

this.form.reset({ 
    type: 'discussion', 
    userPosts: [] 
}); 

编号：https://angular.io/docs/ts/latest/api/forms/index/FormGroup-class.html#!#reset-anchor