angular – PrimeNG MenuCallback

2023年1月26日 268次阅读

我正在使用优秀的prime-ng库中的p-panelmenu.

<p-panelMenu [model]="items" (click)="onClicked(event)"></p-panelMenu>

麻烦的是我无法弄清楚如何让菜单做任何事情. primeNG网站上的示例都显示菜单,但不会触发任何操作.

如何获取当前选定的项目？我注意到menuItem类上有一个“命令”回调;但是为每个菜单项定义一个回调似乎很疯狂.而不仅仅是一个传递所选菜单项的回调.我在这里错过了什么？

最佳答案 我必须编写一个递归函数来遍历菜单项和子项,并为每个项分配一个命令回调：

export class TreeViewComponent implements OnInit {
  @Output() onSelectedChanged: EventEmitter<MenuItem> = new EventEmitter<MenuItem>();

  items : any[] = [];

  constructor (private contentService: ContentService) {
  }

  ngOnInit() {
      this.getFolders();
  }

  getFolders() {
    this.contentService.getFolders().subscribe(this.setItems);
  }

  setItems = (x: any) => {
      this.assignCallback(x);
      this.items = x.items;
  }

  assignCallback(item:MenuItem){
    if(item.items != null && item.items.length > 0) {
      item.items.forEach(x => this.assignCallback(x))
    }
    item.command = this.commandCallback;
  }

  commandCallback(ev){
    console.log(ev.item);
  }
}

我会把问题保持开放;必须有更好的方法吗？

点赞