Нужен совет по [formGroup] formGroupName,[formControl] formControlName

Question

Я смотрю на существующий ответ на вопрос В чем разница между formControlName и FormControl?

и все еще изо всех сил, чтобы полностью понять, когда использовать [formControl] поверх formControlName.

Правильно ли я сделать вывод [основываясь на комментарии @Paul Samsotha], что при создании элемента управления с помощью FormBuilder, аналогичного

constructor(fb: FormBuilder) {
    this.myForm = fb.group({
        'fullname': ['', Validators.required],
        'gender': []
    });
}

Тогда я должен использовать что-то вроде

<form [formGroup]="myForm">

  <label>
    First Name:
    <input type="text" formControlName="fullname">
  </label>

  <label>
    Last Name:
    <input type="text" formControlName="gender">
  </label>

</form>

и если я хочу объявить свою форму следующим образом (на основе @Günter Zöchbauer ansewer):

constructor(fb: FormBuilder) {
    this.myForm = fb.group({
        'fullname': new FormControl('');
        'gender': new FormControl('')
    });
}

используйте следующий синтаксис:

<form [formGroup]="myForm">

  <label>
    First Name:
    <input type="text" [formControl]="fullname">
  </label>

  <label>
    Last Name:
    <input type="text" [formControl]="gender">
  </label>

</form>

Выше правильно? Также то же самое для [formGroup] и formGroupName: Когда бы вы использовали formGroupName поверх [formGroup]? Я не мог придумать пример для этого. Можете ли вы объяснить, почему один может использовать один над другим или какова рекомендуемая практика (если есть)?

Answer 1

По сути, вы используете [formControl] или [formControlName], когда ваша форма является динамической, когда у вас есть фиксированная форма, вы просто используете formControlName.

Это происходит потому, что структура [] в angular является односторонним связыванием, поэтому она отслеживает значение любого свойства вашего компонента.

• [FormControl]="propertyInComponent"
• [FormControlName]="propertyInComponent"
• formControlName = "nameGivenByYou"