Angular ngx数据表如何实现双击/dbl行

Question

ngx数据表没有用于双击行的Output属性。

activate output属性会发出所有事件，这可能会被使用。

我该如何实现？

Answer 1

我创建了一个双击指令。

这里使用它：

<ngx-datatable
(appNgxDatatableDblClick)="onDblClickRow(row)"
...
></ngx-datatable>

指令：

@Directive({
selector: '[appNgxDatatableDblClick]',
})
export class NgxDatatableDblClickDirective implements OnInit {
@Output('appNgxDatatableDblClick') dblClick = new EventEmitter();
constructor(private element: ElementRef) {}
@HostListener('activate', ['$event'])
onActivate(event: Model): void {
if (event.type === 'dblclick' && event.row) {
this.dblClick.emit(event.row);
}
}
// Optional onInit: can be used for styling 
// e.g.: .appNgxDatatableDblClick datatable-row-wrapper { cursor: pointer; }
ngOnInit(): void {
(this.element.nativeElement as Element).classList.add(
'appNgxDatatableDblClick'
);
}
}