Angular 5：带有嵌套 select 选项的 ngFor

Question

我有一组对象。这些对象具有属性版本。版本是一个字符串数组。

我遍历对象。对于每个对象，我都希望有一个包含所有可用版本的下拉字段。

如果用户更改版本，我想将整个对象推送到我的 changeSelectedItem() 函数。

我能够将“[object Object]”打印到控制台。如我所见，[object Object] 已经被推送到我的函数中。

如何实现我想要的功能？

我的HTML:

<tr *ngFor="let object of storeFilesService.objects">
      <td><input type="checkbox" value="a" (click)="checkobject(object)" name="checkbox" [checked]="true">
      </td>
      <td>{{object.id}}</td>
      <td>{{object.name}}</td>
      <td>{{object.version}}
        <select (change)="changeSelectedItem($event.target.value)">
          <option *ngFor="let version of object.versions" value={{object}}>
            {{version}}
          </option>
        </select>
      </td>

TS

      changeSelectedItem(filterVal: any) {
    console.log(filterVal);
  }

Answer 1

这应该是这样工作的：

<tr *ngFor="let object of storeFilesService.objects">
  <td><input type="checkbox" value="a" (click)="checkobject(object)" name="checkbox" [checked]="true">
  </td>
  <td>{{object.id}}</td>
  <td>{{object.name}}</td>
  <td>{{object.version}}
    <select >
      <option *ngFor="let version of object.versions" (click)="changeSelectedItem(version)">
        {{version}}
      </option>
    </select>
  </td>
</tr>

发生了什么变化：

已于 select
已应用（点击）="changeSelectedItem(version)" 选项

Answer 2

<select (change)="changeSelectedItem($event.target.value, object)">

正如@mbppv 所述，这符合我的需要，谢谢。

Angular 5：带有嵌套 select 选项的 ngFor

Angular 5: ngFor with nested select options

ngfor

angular