如何动态定义按钮的功能

时间:2017-02-07 08:26:20

标签: angular

我创建了一个名为'SideMenuComponent'的子组件。它根据“项目”输入动态创建菜单按钮。

export class SideMenuComponent {
  @Input() items: IMenuNode[];
...

模板

<div *ngFor="let item of items">
 <button (click)="item.click(item)">{{item.text}}</button>
</div>

在父组件中,我创建了一个菜单数组。

export class ParentComponent {
     public items: IMenuNode[] = [
        {
          text: "Help",
          icon: "help",
          click: () => { console.log("help me")}
        },
        {
          text: "Feedback",
          icon: "feedback",
        }
      ];
...

并在模板中使用它。

<sidemenucomponent-selector [items]="items"></sidemenucomponent-selector>

按钮及其图标显示没有问题。但是,单击功能不起作用。当我点击“帮助”时,它不会打印“帮助我”

click: () => { console.log("help")}

我该如何解决?

0 个答案:

没有答案