primefaces#1097 use menuItem styleClass and style in p-tieredmenu

amiram · Dec 12, 2017 · e657f03 · e657f03
1 parent a11610f
commit e657f03
Showing 1 changed file with 24 additions and 23 deletions.
diff --git a/src/app/components/tieredmenu/tieredmenu.ts b/src/app/components/tieredmenu/tieredmenu.ts
@@ -12,6 +12,7 @@ import {RouterModule} from '@angular/router';
             <ng-template ngFor let-child [ngForOf]="(root ? item : item.items)">
                 <li *ngIf="child.separator" class="ui-menu-separator ui-widget-content">
                 <li *ngIf="!child.separator" #listItem [ngClass]="{'ui-menuitem ui-widget ui-corner-all':true,'ui-menu-parent':child.items,'ui-menuitem-active':listItem==activeItem}"
+                    [class]="child.styleClass" [ngStyle]="child.style"
                     (mouseenter)="onItemMouseEnter($event, listItem, child)" (mouseleave)="onItemMouseLeave($event)">
                     <a *ngIf="!child.routerLink" [href]="child.url||'#'" class="ui-menuitem-link ui-corner-all" [attr.target]="child.target" [attr.title]="child.title" [attr.id]="child.id"
                         [ngClass]="{'ui-state-disabled':child.disabled}" (click)="itemClick($event, child)">
@@ -37,51 +38,51 @@ import {RouterModule} from '@angular/router';
 export class TieredMenuSub {
 
     @Input() item: MenuItem;
-    
+
     @Input() root: boolean;
-    
+
     constructor(public domHandler: DomHandler) {}
-    
+
     activeItem: HTMLLIElement;
-                
+
     onItemMouseEnter(event: Event, item: HTMLLIElement, menuitem: MenuItem) {
         if(menuitem.disabled) {
             return;
         }
-        
+
         this.activeItem = item;
         let nextElement:  HTMLElement =  <HTMLElement> item.children[0].nextElementSibling;
         if(nextElement) {
             let sublist:  HTMLElement = <HTMLElement> nextElement.children[0];
             sublist.style.zIndex = String(++DomHandler.zindex);
-                        
+
             sublist.style.top = '0px';
             sublist.style.left = this.domHandler.getOuterWidth(item.children[0]) + 'px';
         }
     }
-    
+
     onItemMouseLeave(event: Event) {
         this.activeItem = null;
     }
-    
+
     itemClick(event: Event, item: MenuItem) {
         if(item.disabled) {
             event.preventDefault();
             return true;
         }
-        
+
         if(!item.url) {
             event.preventDefault();
         }
-        
-        if(item.command) {            
+
+        if(item.command) {
             item.command({
                 originalEvent: event,
                 item: item
             });
         }
     }
-    
+
     listClick(event: Event) {
         this.activeItem = null;
     }
@@ -106,20 +107,20 @@ export class TieredMenu implements AfterViewInit,OnDestroy {
     @Input() style: any;
 
     @Input() styleClass: string;
-    
+
     @Input() appendTo: any;
-    
+
     container: any;
-    
+
     documentClickListener: any;
-    
+
     preventDocumentDefault: any;
-    
+
     constructor(public el: ElementRef, public domHandler: DomHandler, public renderer: Renderer2) {}
 
     ngAfterViewInit() {
         this.container = this.el.nativeElement.children[0];
-        
+
         if(this.popup) {
             if(this.appendTo) {
                 if(this.appendTo === 'body')
@@ -129,34 +130,34 @@ export class TieredMenu implements AfterViewInit,OnDestroy {
             }
         }
     }
-    
+
     toggle(event: Event) {
         if(this.container.offsetParent)
             this.hide();
         else
             this.show(event);
     }
-    
+
     show(event: Event) {
         this.preventDocumentDefault = true;
         this.container.style.display = 'block';
         this.domHandler.absolutePosition(this.container, event.currentTarget);
         this.domHandler.fadeIn(this.container, 250);
         this.bindDocumentClickListener();
     }
-    
+
     hide() {
         this.container.style.display = 'none';
         this.unbindDocumentClickListener();
     }
-    
+
     unbindDocumentClickListener() {
         if(this.documentClickListener) {
             this.documentClickListener();
             this.documentClickListener = null;
         }
     }
-    
+
     bindDocumentClickListener() {
         if(!this.documentClickListener) {
             this.documentClickListener = this.renderer.listen('document', 'click', () => {