有没有办法在 ng For 中搜索答案

【问题标题】：Is there a way to search inside the ng For有没有办法在 ng For 中搜索
【发布时间】：2019-09-27 15:56:34
【问题描述】：

我有两个数组文件，当前正在运行。假设文件在索引 0 中，它的进度在 currentlyRunning[1].progress 内，即索引 1 我正在运行ngFor 来显示所有文件。 td 中的 ngIf 是否可以获取正确的进度，因为索引可能不同但文件 ID 是唯一的。

<tr *ngFor="let files of File; let index=i;">
  <td>
    {{file.name}}
  </td>
  <td>
    {{file.id}}
  </td>
  <td *ngIf="file.id === currentlyRunning[i].id">
    {{currentlyRunning.progress}}
  </td>
<tr>

【问题讨论】：

最好创建一个字典/索引器并以这种方式检索它。这将更具可读性和性能。
另见Declare and initialize a Dictionary in Typescript，currentlyRunning 将是查找。

标签： angular

【解决方案1】：

你可以在你的组件类中创建一个函数并在你的 ngIf 指令语句中使用它

【讨论】：

【解决方案2】：

我建议否则，您应该将数据相互映射...

ngOnChages() {
  this.mapedData = currentlyRunning.reduce((map, file) => {
    map[file.id] = file;
    return map;
  }, {} as { [id: number]: iFile });
}

然后你会在你的模板中使用简单的查找：

<tr *ngFor="let file of files; let index=i;">
  <td>
    {{file.name}}
  </td>
  <td>
    {{file.id}}
  </td>
  <td *ngIf="mapedData[file.id] as currentlyRunning">
    {{currentlyRunning.progress}}
  </td>
<tr>

这种方式只是 O(n) 复杂度，你有一个很好的方法来处理所有这些

【讨论】：