setAttribute не будет работать с ngModel в угловых

Question

Я пытаюсь автоматически назначить ngModel при создании html-элемента. Это мой код,

productName.setAttribute('[(ngModel)]', `customProductName`);

Но я продолжаю получать эту ошибку,

Failed to execute 'setAttribute' on 'Element': '[(ngModel)]' is not a valid attribute name.

другие атрибуты HTML работают нормально. Пожалуйста, как мне это сделать, спасибо.

Answer 1

Я не установил значение ngModel, как вы, но я мог бы предложить, самое простое решение для установки значения пользовательской модели, как показано ниже,

создать model интерфейс как,

productModel.ts

export interface ProductModel {
    productName: string;
}

А в вашем шаблоне

product.component.html

если это входной тег,

// other code form code here        

<input type="text" name="productName" id="productName" placeholder="Your productName" [(ngModel)]="model.productName">

// more code here

В компоненте,

product.component.ts

// create an instance of ProductModel instance by name variable model
model: ProductModel = new ProductModel();

// set the product name with custom value as below on ngOninit fuction
ngOninit () {
    this.model.productName = 'Custom product Name';
}

Пожалуйста, дайте мне знать, если это решение полезно или нет .. спасибо

Примечание. Это пример формы, управляемой шаблоном. с реактивными формами также