Может быть, вы можете добиться этого, используя [ngModelGroup]
, мы предполагаем, что у нас есть модель LabelCalss
export interface LabelCalss {
label?: string;
}
, попробуйте это:
в вашем app.component.ts:
formValue: any;
tags: LabelCalss[] = [
{ label: "important" },
{ label: "difficult" }
]
onSubmit(f: NgForm) {
let tags = Object.keys(f.value).map(item => {
return f.value[item];
});
this.formValue = tags;
console.log(tags);
// Object.keys because the new indexes are string
}
addNewRow() {
this.tags.push({})
}
и в вашем app.component.html
<code><form #f="ngForm" (ngSubmit)="onSubmit(f)">
<div class="form-group" *ngFor="let x of tags; index as i" [ngModelGroup]="i">
<input name="label" class="form-control" [(ngModel)]="x.label">
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
<button (click)="addNewRow()" class="btn btn-success mt-5 mb-5">Add New Row</button>
<pre style="background-color:#ddd">
{{tags|json}}
Представленный объект:{{FormValue |}} JSON
DEMO