src/ui/menu/smart-hamburger-menu/smart-hamburger-menu-item.component.ts
selector | li[smart-hamburger-menu-item] |
styleUrls | ./smart-hamburger-menu-item.component.css |
templateUrl | ./smart-hamburger-menu-item.component.html |
Properties |
Methods |
Inputs |
Outputs |
Accessors |
constructor(elementRef: ElementRef)
|
||||||
Parameters :
|
isChild |
Type : boolean
|
model |
Type : HamburgerMenuStructureItem
|
onSelected |
Type : EventEmitter<HamburgerMenuStructureItem>
|
openStateChanged |
Type : EventEmitter<literal type>
|
menuItemOpenStateChanged | ||||||
menuItemOpenStateChanged(ev: any)
|
||||||
Parameters :
Returns :
void
|
onSelectedAction | ||||||
onSelectedAction(itm: HamburgerMenuStructureItem)
|
||||||
Parameters :
Returns :
void
|
childItems |
Type : QueryList<SmartHamburgerMenuItemComponent>
|
Decorators :
@ViewChildren(SmartHamburgerMenuItemComponent)
|
open | ||||||
getopen()
|
||||||
Returns :
boolean
|
||||||
setopen(value: boolean)
|
||||||
Parameters :
Returns :
void
|
<ng-container *ngIf="model.HasChild">
<a role="button" [ngClass]="{ 'dropdown-toggle': true }" (click)="open = !open" aria-haspopup="true" aria-expanded="false">
{{model.MenuName}} <span class="caret"></span>
</a>
<ul class="dropdown-menu">
<ng-container *ngIf="open">
<li (onSelected)="onSelectedAction(child)" (openStateChanged)="menuItemOpenStateChanged($event)" [isChild]="true" smart-hamburger-menu-item *ngFor="let child of model.Children" [ngClass]="{ 'dropdown-toggle': child.HasChild, 'child-item': isChild }" [model]="child">
</li>
</ng-container>
</ul>
</ng-container>
<ng-container *ngIf="!model.HasChild">
<a role="button" data-toggle="collapse" data-target="#smart-hamburger-menu" (click)="onSelectedAction(model)">
<ng-container *ngIf="!!model.MenuSmallImage">
<img [src]="model.MenuSmallImage">
</ng-container>
{{model.MenuName}}
</a>
</ng-container>
./smart-hamburger-menu-item.component.css
ul.dropdown-menu>li.child-item {
padding: 5px 15px 5px 25px !important;
}