html - 无法分配给类型错误的 Angular BehaviourSubject 问题

Question

我有一个带有 Angular 和 typescript 的简单表格。我将表数据从父类发送到子类(包括表)，在此示例中数据名称是 _domainData。它正在正确获取数据，但我想在表上显示它，但我不知道如何将它分配给我的主表数据变量 domain_Data。

如示例所示:如果我在 ngOnInit() 方法中说 this.domain_Data = this._domainData;。

@Component({
  selector: 'mg-domain-display',
  templateUrl: './domain-display.component.html',
  styleUrls: ['./domain-display.component.scss']
})
export class DomainWhiteListingDisplayComponent implements OnInit {

  private _domainData = new BehaviorSubject<Domain[]>([]);

  displayedColumns = ['id', 'domain'];
  domain_Data: Domain[] = [];

  @Input()
  set domainData(value: Domain[]) {
    this._domainData.next(value);
  }
  get domainData() {
    return this._domainData.getValue();
  }

  constructor(private globalSettingService: GlobalSettingsService, private dialog: MatDialog) {
  }

  ngOnInit() {
    this.domain_Data = this._domainData;
  }

}

错误是 Type:BehaviourSubject is not assignable to type Domain[]。 “BehaviourSubject”类型中缺少属性“includes”

正如我所说，我的主表数据变量是 domain_Data:

<mat-table #table [dataSource]="domain_Data">

Answer 1

需要订阅并从BehaviorSubject中获取值

  ngOnInit() {
    this._domainData.subscribe((data) => this.domain_Data = data);
  }

或者，正如很少有人评论的那样，您可以使用 async 管道在模板中订阅:

<mat-table #table [dataSource]="domain_Data | async">

通常，如果您不需要处理组件中的数据，最好使用 async 管道，因为它会自动取消订阅。