代码之家 › 专栏 › 技术社区 › Sumchans

mattabledatasource-向服务器添加新记录时如何刷新表

rxjs6 angular-material angular

1

Sumchans · 技术社区 · 8 年前

我的数据拉取功能很好,但是在添加新记录后无法获得重新加载功能。据我所知,每当对behaviorsubject调用下一个方法时,所有观察者都会收到它的通知,并且数据重新加载会自动进行。但不是那样的。

组件.ts

dataSource = new MatTableDataSource<IWorkOrders>();
  ngOnInit() {
    this.bs.wobSubject$.subscribe((data:IWorkOrders[]) => {
      this.dataSource.data = data;
    })

这是用来发布新记录的代码

this.bs.postWorkOrder(this.saleForm.value);

服务.ts

      public wobSubject$ = new BehaviorSubject<IWorkOrders[]>([]);
    constructor(private http: HttpClient) {
     this.getWorkOrder(); 
    }
      getWorkOrder() {
        this.http.get(this.BASE_URL + '/getworkorders/')
        .subscribe((data:IWorkOrders[]) => {
          this.wobSubject$.next(data);
        });
      }
  postWorkOrder(workOrder: IWorkOrders) {
    this.http.post<IWorkOrders>(this.BASE_URL + '/addworkorder/', workOrder)
    .subscribe((data: any) => {
      this.wobSubject$.next(data);
    });
  }

2 回复 | 直到 8 年前

1

Pardeep Jain 8 年前

打电话给你 getRequest 像这样将新记录发布到服务器后再次-

 getWorkOrder() {
        this.http.get(this.BASE_URL + '/getworkorders/')
        .subscribe((data:IWorkOrders[]) => {
          this.wobSubject$.next(data);
        });
      }
  postWorkOrder(workOrder: IWorkOrders) {
    this.http.post<IWorkOrders>(this.BASE_URL + '/addworkorder/', workOrder)
    .subscribe((data: any) => {
      this.getWorkOrder()
    });
  }

2

Maryannah 8 年前

this.bs.wobSubject$.subscribe((data:IWorkOrders[]) => {
  this.dataSource.data = data;
})

Angular提供了数据源的抽象,您不应该在其中胡乱操作。

试着用这个代替。

this.bs.wobSubject$.subscribe((data:IWorkOrders[]) => {
  this.dataSource = new MatTableDataSource(data);
})