用承诺填充MatTables(异步行)

时间:2018-08-12 11:10:15

标签: angular angular-material

我正在尝试在MatTable中显示对象的集合。我有一个包含每个对象URL的列表,所以我想异步填充行(我可以将所有空行放在前面,然后在加载数据时填写数据) 所以,这是我的数据源

export class TableDataSource extends DataSource<Promise<any>> {

  private _items: Promise<any>[];

  constructor(private loader: LoaderService, private collection: ObjectMember) {
    super();
  }
  connect():  Observable<Promise<any>[]> {
    if (!this._items) {
      //aggregates each Promise<any> into an array.
      this._items = this.collection.value.map(x => this.mm.load(ObjectRepr, x.href));
    }
    return Observable.of(this._items);
  }
  disconnect() {}
}

这是我的桌子

<mat-table #table [dataSource]="CollectionSource" class="mat-elevation-z8" sort>
    <ng-container matColumnDef="Name">
        <mat-header-cell *matHeaderCellDef> Name</mat-header-cell> 
        <td mat-cell *matCellDef="let element"> {{element.name}} </td>
      </ng-container>

      <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
      <mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
</mat-table>

这显示正确的行数,但未填充。承诺没有得到解决。

我尝试了以下操作,但是在两种情况下我都遇到编译错误:

 <td mat-cell *matCellDef="let element | async"> {{element.name}} </td>

  <mat-row *matRowDef="let row| async"; columns: displayedColumns;">

我是否想以任何方式实现目标?

1 个答案:

答案 0 :(得分:1)

您需要使用Observable.forkjoin()来处理for循环中的observable。

modelBuilder.Entity<Organization>() // One organizatio
 .HasMany(c => c.User)        //has mamy users
 .WithOptional(c => c.Organization) //  but each user doesnt have organization
 .HasForeignKey(c => c.OrganizationId) // user who have organization, has foreignnId
 .WillCascadeOnDelete(false);