Question

我正在使用Angular 6.1.1和HandsonTables 5.0.0

我的热表正在正确显示并填充了数据。我将一列设置为可编辑，但是当我通过在列中键入afterChange事件根本不触发而更改值时，配置如下所示。

组件HTML：

<hot-table [hotId]="hotInstance" [settings]="hotSettings"
           [data]="dataset" (afterChange)="onAfterChange($event)"></hot-table>

组件TS（ngOnInit和FetchData被称为ok，在编辑FieldA时未引发onAfterChange）：

export class PartsComponent implements OnInit {

dataset: any;
fetched = false;
error = false;
hotInstance: string = 'hot';
user : object = {};

hotSettings = { };

constructor(private route: ActivatedRoute, 
private location: Location, 
private repositoryService: RepositoryService,
private hotRegisterer: HotTableRegisterer,
private auth: AuthService) { 


  const $component = this;

  this.hotSettings = {
    colHeaders: ['System ID', 'Field A', 'Field B.'],
    columns: [
      {
        data: 'Id',
        type: 'numeric',
        readOnly: true
      },
      {
        data: 'FieldA',
        type: 'text',
        readOnly: false
      },
      {
        data: 'FieldB',
        type: 'text',
        readOnly: true
      }
    ],
    allowInsertColumn: false,
    allowRemoveColumn: false,
    selectionMode: 'single',
    //contextMenu: ['remove_row'],
    rowHeaders: true,
    filters: true,
    dropdownMenu: ['filter_by_condition', 'filter_action_bar'],
    height: 400,
    outsideClickDeselects: false,
    hiddenRows: {
      indicators: false
    }
  };
}

 ngOnInit() {
   this.auth.getUser().subscribe(
    usr => {
      console.debug('parts.ngOnInit()');
      console.debug(usr);
      this.fetchData();
    }, e => console.debug(e)
  );
 }

fetchData():void {
  console.debug("fetchData()")
  this.repositoryService.getParts()
    .subscribe(
      parts => this.dataset = parts,
      err => this.error = true,
      () => this.fetched = true
    );
}


onAfterChange($event) {
  console.debug('onAfterChange()'); \\ <--- not being called 
  console.debug($event);

}



}

Answer 1

您没有说关于您正在使用的angular-handsontable版本的任何信息。我的答案基于当前版本。

可合理使用的钩子不是Angular事件。事件是“触发并忘记”功能，Handsontable使用回调，因此它们可以取消操作或修改数据。回调应绑定为输入，而不是输出。

查看angular-handsontable发行说明以了解详细信息：https://github.com/handsontable/angular-handsontable/releases/tag/2.0.0

HandsonTable事件未触发

1 个答案: