带有 as 和 let 的角度异步管道

Question

我有一个商店状态，我正在使用可观察的和管道async。我正在使用as语法来读取返回的对象。
该对象很复杂，并且具有由另一个可观察对象引用async以显示信息的字段。
我可以做如下的事情吗？

<div *ngIf="(fileObs$ | async) as files; let fileList= files[user.UserId]">
<div *ngFor="let file of fileList">
  ...
</div>
<!-- instead of -->
<div *ngFor="let file of files[user.UserId]">
  ...
</div>

Answer 1

您可以使用ng-template声明新变量fileList并用于ng-container等待异步数据加载，然后激活template

<ng-container *ngTemplateOutlet="files; context:{file :fileObs$ | async}"></ng-container>

<ng-template #files let-fileList="file[user.UserId]">

   File List 
   <br>-------
   <div *ngFor="let file of fileList ">
      {{file}}
    </div>
</ng-template>

演示版

我没有user.UserId在我的演示中进行过滤，但是您绝对可以在将数据分配给fileListas时执行此操作let-fileList="file[user.UserId]"