【问题标题】:primeng panel menu click event启动面板菜单点击事件
【发布时间】:2018-02-02 04:47:34
【问题描述】:
<p-panelMenu [model]="items" [style]="{'width':'300px'}" (click)="clicked($event)"></p-panelMenu>`<p-dialog header="Title" [(visible)]="display">
page 1

`

这是我的 ts ` 点击:任意;

display: boolean = false;

constructor() {

 }

 items: MenuItem[];

     ngOnInit() {
         this.items = [
             {
                 label: 'Chapter 1',
                 icon: 'fa-file-o',
                 items: [{
                         label: 'Chapter1.1', 
                         icon: 'fa-plus',
                         items: [
                             {label: 'Chapter1.1.1'},
                             {label: 'Chapter1.1.2'},
                         ]
                     },
                     {label: 'Chapter1.2'},
                     {label: 'Chapter1.3'}
                 ]
             },
             {
                 label: 'Chapter 2',
                 icon: 'fa-edit',
                 items: [
                     {label: 'Chapter 2.1', icon: 'fa-mail-forward'},
                     {label: 'Chapter 2.2', icon: 'fa-mail-reply'}
                 ]
             }


         ];
     }
     clicked(event=1) {
         console.log("event",event)

            this.display=true;


    }
}

`

panel menu image

这是我的面板菜单的图片。 单击每个章节时,我需要为每个不同的章节显示一个不同的面板我如何为每个章节提供事件。谁能帮助我。

【问题讨论】:

  • 使用 [ngStyle] 而不是 [style]
  • “为每个不同的章节显示不同的面板”是什么意思?没明白你的意思。
  • 如果你能看到我命名为第 1 章、第 2 章的图像。不同的面板意味着在primeng 中有面板。所以每章的点击我需要显示不同的面板。
  • 你的问题不清楚,p-dialog里面是什么?为什么 p-dialog 没有结束标签?此方法语法不正确 clicked(event=1) ,正确语法是 clicked(event)。此缺陷似乎与您的问题有关 github.com/primefaces/primeng/issues/3309
  • 我需要一个点击事件,所以点击不同章节(如图所示)我需要显示不同的段落

标签: angular primeng


【解决方案1】:

与这样的菜单项绑定功能

this.items = [ { 标签:'项目 1', 命令:(事件)=> { this.clickItem1(); } }]

创建您之前提供的函数

clickItem1() { console.log('点击'); }

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-03-23
    • 2011-11-20
    • 1970-01-01
    • 2014-06-03
    • 1970-01-01
    • 2017-05-29
    相关资源
    最近更新 更多