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

时间:2017-07-12 12:34:35

标签: angular typescript primeng

我试图将基类函数绑定到我的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;
    .....

}

我认为绑定到命令时无法解析基类函数。有任何线索如何解决这个问题?

1 个答案:

答案 0 :(得分:4)

我通过遵循命令绑定解决了这个问题。

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

似乎在绑定菜单项的onClick事件时,它可以正常工作。