删除通过订阅ngOnInit()服务创建的空行

时间:2018-12-19 12:49:15

标签: typescript service angular7 ngoninit

我有一个材料数据表,用户可以自己填写和清空。进入表的数据由服务触发,我在表组件中使用ngOnInit()对其进行了初始化。

代码:

  ngOnInit() {
    this._AS.transaction$.subscribe( transaction => {
        this.transaction = transaction;
        this.temp = this.dataSource.data.slice();
        this.temp.push(this.transaction); // Stop this call on init somehow?
        this.dataSource.data = this.temp;
        this.ref.detectChanges();
        console.log(this.transaction);
      }
    );
  }

问题是:调用this.temp.push(this.transaction)总是压入一个空行。有没有办法第一次停止此通话或类似的操作?

2 个答案:

答案 0 :(得分:0)

为什么它是空的,因为“交易”是? 那么,为什么不只使用if查询呢? 或者,您可以在父组件中声明一个(bool)变量,并在首次点击ngOnInit时将其设置为true

constructor( public parentComponent: ParentComponent) {

}

ngOnInit() {
  if(parent.isInitialized) {
    this._AS.transaction$.subscribe( transaction => {
      this.transaction = transaction;
      this.temp = this.dataSource.data.slice();

      if(parent.isInitialized) {
        this.temp.push(this.transaction); // Stop this call on init somehow?
      } else {
        parent.isInitialized = true;
      }

      this.dataSource.data = this.temp;
      this.ref.detectChanges();
      console.log(this.transaction);
    } );
}

答案 1 :(得分:0)

我只是使用了另一种方式: 将空事务放入表后,我将其弹出,以便表再次为空。推送数据现在可以正常工作。

  ngOnInit() {
      this._AS.transaction$.subscribe(transaction => {
          this.transaction = transaction;
          this.temp = this.dataSource.data.slice();
          this.temp.push(this.transaction);
          this.dataSource.data = this.temp;
          this.ref.detectChanges();
        }
      );
      this.temp = this.dataSource.data.slice();
      this.temp.pop();
      this.dataSource.data = this.temp;
      this.ref.detectChanges();
  }