在angular4中执行操作后数据没有更新?

时间:2017-09-20 09:11:43

标签: angular angular2-template angular2-services

我正在尝试构建自己的自定义数据网格,它正在运行, 问题是在执行删除数据未更新等任何操作后

my.component.html

<grid [data] = "data" [columns]="columns"
  (actionChanged) = "onChangeAction($event)"> </grid>

my.component.ts

onChangeAction (actionData) {
    console.log(actionData, 'action change data in main component')
    if (actionData.action === 'delete') {
          this.delete (actionData)
    }

    if (actionData.action === 'add') {
        this.add (actionData)
  }
  }
  delete (actionData) {
    console.log(actionData, 'delete function calll', this.data.length)
    const index: number = this.data.indexOf(actionData.rowData.name);
    if (index === -1) {
        this.data.splice(index, 1);
    };
    console.log(this.data.length, index)  
  }
  add (actionData) {
    console.log(actionData, 'add function calll')
  }

** grid.ts **

 @Output() public actionChanged:  EventEmitter<any> = new EventEmitter();

  public updateAction (row, action) {
    console.log(row, 'Row', action)
    let actionData = {
          rowData: row,
          action: action
        }
   this.actionChanged.emit(actionData);
 }

我使用@Input()从网格中获取数据@outPUt()

我从grid-my.component获取数据完美,probelm是在执行删除操作数据后没有更新到网格。

请任何人都可以帮助我。   提前致谢

1 个答案:

答案 0 :(得分:0)

您需要向grid.ts添加方法

ngOnChanges(changes: SimpleChanges) {
  // changes holds the new data
  // so you could set
  // this.data = changes;
}