Обслуживать угловую форму с пустым значением

#angular

#угловое

Вопрос:

У меня есть следующий метод инициализации формы. Я пытаюсь обслуживать случаи, когда нет значения электронной почты, т. Е. из api не поступает значение электронной почты. В настоящее время я получаю следующую ошибку: ОШИБКА TypeError: не удается прочитать значение свойства undefined

   private initForm() {
    this._userService.getCurrentUserProfileData()
      .subscribe((user) => {
        this.userReady = user;
        console.log(this.userReady);
        this.userFormGroup = new FormGroup({
          firstName: new FormControl(this.userReady.firstname, [Validators.required, Validators.pattern('^[a-zA-Z]*$')]),
          lastName: new FormControl(this.userReady.lastname, [Validators.required, Validators.pattern('^[a-zA-Z]*$')]),
          email: new FormControl(this.userReady.corporateContactChannels[0].value, [Validators.required, Validators.email]),
          mobile: new FormControl(this.userReady.corporateContactChannels[1].value, [Validators.required, Validators.pattern('^[0-9]*$')]),
          workNumber: new FormControl(this.userReady.corporateContactChannels[2].value, [Validators.required, Validators.pattern('^[0-9]*$')]),
          role: new FormControl({value: this.storeService.setStoreData().profile.role, disabled: true} , Validators.required)
        });
      }, (error) => {
        this._errorService.openErrorPopup('Failed to get profile data.');
      }
    );
  }
  

Я попробовал * ngIf в html-форме, но, похоже, он прерывается в строке электронной почты в ts-файле. Что-нибудь, что я могу попробовать?

Ответ №1:

Заменить

 this.userReady.corporateContactChannels[0].value 
  

с

 this.userReady.corporateContactChannels[0] 
  ? this.userReady.corporateContactChannels[0].value 
  : ''; // or whatever default value you want to use
  

Единственное, что следует отметить, это то, что вы используете индексы, которые имеют позиционное значение, я надеюсь, что они сохраняются / соблюдаются, если из API включены неопределенные значения.

Ответ №2:

Если вы просто хотите избежать этого, сделайте что-то вроде:

 
this.userFormGroup = new FormGroup({
  ...
  email: new FormControl(
            this.userReady amp;amp; this.userReady.corporateContactChannels[0] 
              ? this.userReady.corporateContactChannels[0].value 
              : null, 
            [Validators.required, Validators.email]),
  mobile: ...
});