Question

的引导

我有一个场景，其中数据对象有多个人，每个人可以有多个地址。当在文本区域中显示选择地址类型完整地址时，在下拉列表中显示地址类型。

<div *ngFor="let persons of data; let i = index">
    <div *ngFor="let person of persons; let j = index">
      <select [ngModel]="selectedAddress[j]" (ngModelChange)="selectedAddress[j] = $event">
        <option *ngFor="let address of person.addresses" [ngValue]="address">
            {{address.type}}
        </option>
      </select>
      <textarea [(ngModel)]="selectedAddress[j].address"></textarea>
    </div>
</div>

每个人都显示在每个div块中。选择div'Person A'的下拉菜单。在div'Person B'中填充textarea。如何处理这种情况？

上一篇文章修复了同一父div中的地址集合问题。这里的问题是围绕人物收集。当您尝试选择父A中的下拉列表时，也会在父B中填充textarea。

Answer 1

你可以有一个二维数组......但考虑做一个重构，以便更清洁的实现。

初始化selectedAddress，如：selectedAddress = [[]]，并执行以下操作：

<div *ngFor="let persons of data; let i = index">
<div *ngFor="let person of persons; let j = index">
  <select [ngModel]="selectedAddress[i][j]" (ngModelChange)="selectedAddress[i][j] = $event">
    <option *ngFor="let address of person.addresses" [ngValue]="address">
        {{address.type}}
    </option>
  </select>
  <textarea [(ngModel)]="selectedAddress[i][j].address"></textarea>
</div>
</div>

我不知道exaclty if（ngModelChange）=“selectedAddress [i] [j] = $ event”更新selectedAddress [i] [j]，如果没有，selectedAddress [i] [j] .address将崩溃。但我认为如果最后的解决方案有效，那就必须起作用。如果崩溃，请使用空对象控制数组。但我再说一遍，这个解决方案有点棘手。

数组模型 - Angular 2

1 个答案: