Angular 2 - 서브 스크립 션에서 양식을 만들면 formGroup이 정의되지 않았다는 오류가 발생합니다.

Question

Firebase 데이터베이스에 일부 데이터가 있습니다. FormBuilder을 통해 양식에 적용하고자하는 데이터입니다. 다소 효과가 있지만 오류가 더 자주 나타나는 것은 formGroup expects a FormGroup instance. Please pass one in.입니다.

구독을 시작하게하는 데이터베이스에 새로운 변경 사항을 적용 할 때 오류가 발생합니다. 업데이트 후에 구독이 실행되기 전후에 this.settingsForm이 설정되었지만

this.eventSubscription = this.af.database.object('/events/' + this.eventId).subscribe(
    (event: IEvent) => { 

    const rsvp: IRSVP = event.rsvp; 
    const settings: ISettings = event.settings; 
    const tickets: ITickets = event.tickets; 

    this.settingsForm = this.fb.group({ 
     collaborators: this.fb.array(settings.collaborators || []), 
     isRSVPOpen: settings.isRSVPOpen, 
     isAutoApproveToGuestlist: settings.isAutoApproveToGuestlist, 
     rsvp: this.fb.group({ 
     latestDate: [rsvp.latestDate, [Validators.required]], 
     latestTime: [rsvp.latestTime, [Validators.required]], 
     guestLimit: [rsvp.guestLimit, [Validators.required]], 
     isGuestPlusOne: rsvp.isGuestPlusOne, 
     isAutoApproveToGuestlist: rsvp.isAutoApproveToGuestlist, 
     isOnlyFacebookRSVP: rsvp.isOnlyFacebookRSVP, 
     isBirthdayAndPhoneRequired: rsvp.isBirthdayAndPhoneRequired 
     }), 
     tickets: this.fb.group({ 
     info: this.fb.group({ 
      closingDate: tickets.info.closingDate, 
      closingTime: tickets.info.closingTime 
     }), 
     types: this.fb.array(tickets.types || []) 
     }) 
    }); 
    } 
); 

가

그래서 내가 궁금하네요 내가 그것을 어떻게 이런 일이 왜 을 을 방지 할 수 있습니다되고있다

: 여기

구독입니까? 이런 식으로 초기화 할 수 없습니까?

Answer 1

*ngIf="settingsForm"을 사용하십시오.

FormGroup이 초기화되지 않은 경우 서식 파일에서 사용할 수 없습니다. 예를 들어, 다음은 settingsForm가 초기화되어 있지 않은 경우 작동하지 않습니다

<form [formGroup]="settingsForm "> 
    <input formControlName="name" /> 
</form> 

대신이 작업을 수행 :

<form *ngIf="settingsForm" [formGroup]="settingsForm "> 
    <input formControlName="name" /> 
</form>