PrimeNG 菜单项命令绑定到基本 class 函数

Question

我正在尝试将基本 class 函数绑定到我的 Angular 2 个 PrimeNG 菜单项。

HTML

<p-menu #menu popup="popup" [model]="exportItems"></p-menu>
<button type="button" class="fa fa-download" title="Export As" (click)="menu.toggle($event)"></button>

打字稿

exportItems: MenuItem[];

//Inside NgOnInit
this.exportItems = [
{ label: 'SVG', command: super.ExportSVG },
{ label: 'PNG', command: super.ExportPNG }];

//Error here 
//Cannot read property 'canvasID' of undefined
ExportSvg(): void
{
    var canvas = document.getElementById(this.canvasID) as HTMLCanvasElement;
    .....

}

我认为基础 class 函数在绑定到命令时无法解析。任何线索如何解决这个问题？

Answer 1

好吧，我通过以下命令绑定解决了这个问题。

this.exportItems = [
{ label: 'SVG', command: (onclick)=> {super.ExportSVG()} },
{ label: 'PNG', command: (onclick)=> {super.ExportPNG()} }];

看来绑定菜单项的onClick事件是没问题的

PrimeNG 菜单项命令绑定到基本 class 函数

PrimeNG menu item command binding to base class function

angular

typescript

primeng