I am currently working on dynamically creating an ion-input element when the user clicks on the "+" sign. My goal is to then insert all the input values into an array. While I have successfully created the inputs, I am facing an issue with assigning the [(ngModel)] attribute to the new elements. How can I achieve this?
This is the method used to create new elements:
newElement() {
const item = document.createElement('ion-item');
const input = document.createElement('ion-input');
input.placeholder = 'شماره سریال';
input.type = 'text';
input.required = true;
input.name = 'serialNumbers';
input.className = 'input inputSerial';
input.ngModel='serialNumbers';
const div = document.getElementById('newElements');
console.log(item);
item.appendChild(input);
div.appendChild(item);
}
When the page first loads, this is the default input:
<ion-item>
<ion-input
type="text"
expand="block"
placeholder="شماره سریال"
required
name="serialNumbers"
[(ngModel)]="serialNumbers"
></ion-input>
The serialNumbers array only captures the value of the default input