Угловая 2 классная вязка

Question

Я очень новичок в этом и пытаюсь понять вещи из приведенного ниже фрагмента кода шаблона Angular 2.

<label for=”productNameInput”>Product Name</label> 
<input type=”text”
id=”productNameInput” 
placeholder=”Product Name”
[ formControl]=”myForm. get ( ’productName ’)” 
[ (ngModel) ] = ”productName”>

У меня есть 2 вопроса:

• Какие атрибуты должныбыть определенным в соответствующем классе?
• Для чего используются фигурные скобки вокруг ngModel?

Большое спасибо!

Answer 1

В логике компонента вы должны определить

myForm: FormGroup;

productName: string;

constructor(private formBuilder: FormBuilder) {
  this.myForm = this.formBuilder.group({ productName: '' });
}

Вы должны определить его так, потому что код (плохо) написан, но вы можете сильно упростить его.

Скобки (и скобки) вокруг ngModel относятся к привязке данных Angular:

• [x] означает, что вы вводите значение в структуру
• (x) означает, что каркас выводит значение для вас
• [(x)] - это двусторонняя привязка : вы можете обновить представление, введя значение и значение компонентапеременная обновляется при выводе значения.

Кстати, formControl и ngModel являются дубликатами, вы должны удалить любой из них.

Answer 2

фигурные скобки вокруг ngModel указывают на двухстороннее связывание.Здесь ссылка для получения дополнительной информации

https://blog.thoughtram.io/angular/2016/10/13/two-way-data-binding-in-angular-2.html

Answer 3

• [(ngModel)]

[()] = БАНАН В КОРОБКЕ

[(x)]синтаксис объединяет скобки привязки свойства [x] с круглыми скобками привязки события (x).

Это двухстороннее связывание данных в Angular, означает, что вы вносите изменения всторона контроллера или сторона обзора изменят свое значение в угловых.

Вы также можете разделить его в привязках attribute и event.как это -

[ngModel] для привязки атрибутов и (ngModelChange) для привязки событий

Для получения дополнительной информации о двусторонней привязке данных вы можете обратиться к официальной документации здесь -

• https://angular.io/guide/template-syntax#ngmodel---two-way-binding-to-form-elements-with-ngmodel

Какие атрибуты должны быть определены в соответствующем классе?

productName здесь в вашем коде есть переменная, которую вам нужно определитьв классе, чтобы связать значение для просмотра части.