Question

我想创建* ngFor绑定，以使用数组和ngModel输入创建另一种形式。

因此，当我在其中选择值时，我单击按钮以显示具有不同值的新表格。

有什么想法应该如何工作？

我已经尝试过，但是结果与其他ngModel值相同。

这是针对我公司的Progress Tracker，它使用Clarity-VMWare在AngularJS 8上运行。我尝试使用let i = index，但它没有获取值。

HTML ：

<div class="card card-report" *ngFor="let item of report">
    <div class="card-block block-card">
        <div class="card-title">
            <div class="clr-wrapper">
                <select class="clr-select-1" [(ngModel)]="selectedProjects">
                    <option [ngValue]="default" disabled>Project yang kamu kerjain apa?</option>
                    <option [ngValue]="item" *ngFor="let item of listProjects">
                        {{item.name}}
                    </option>
                </select>
            </div>

            <div class="clr-wrapper">
                <select class="clr-select-2" [(ngModel)]="selectedRoles">
                    <option [ngValue]="default" disabled>Kamu jadi apa di project ini?</option>
                    <option [ngValue]="item" *ngFor="let item of listRoles">
                        {{item.name}}
                    </option>
                </select>
            </div>
        </div>
        <div class="card-text text-card">
            <p class="sub-text-card">Kamu belum melakukan apa-apa</p>
        </div>
    </div>
</div>

TS ：

listProjects: any[]
listRoles: any[]
selectedProjects: any;
selectedRoles: any;

addReport() {
  this.report.push(this.report.length)
}

表单数组正在工作，但是我想知道该值应该与其他选择值有何不同。我希望的结果是：应该类似于添加新的表单数组，但是其中的值可以更改。

Answer 1

尽管您要问的不是很清楚。但是我看到的可能是[ngValue]。您可以尝试使用[value]。

 <option [value]="item.name" *ngFor="let item of listProjects">
       {{item.name}}
 </option>

将ngModel输入绑定到Angular中的表单数组

1 个答案: