File

src/ui/menu/smart-hamburger-menu/smart-hamburger-menu-item.component.ts

Implements

OnInit

Metadata

selector li[smart-hamburger-menu-item]
styleUrls ./smart-hamburger-menu-item.component.css
templateUrl ./smart-hamburger-menu-item.component.html

Index

Properties
Methods
Inputs
Outputs
Accessors

Constructor

constructor(elementRef: ElementRef)
Parameters :
Name Type Optional
elementRef ElementRef No

Inputs

isChild
Type : boolean
model
Type : HamburgerMenuStructureItem

Outputs

onSelected
Type : EventEmitter<HamburgerMenuStructureItem>
openStateChanged
Type : EventEmitter<literal type>

Methods

menuItemOpenStateChanged
menuItemOpenStateChanged(ev: any)
Parameters :
Name Type Optional
ev any No
Returns : void
onSelectedAction
onSelectedAction(itm: HamburgerMenuStructureItem)
Parameters :
Name Type Optional
itm HamburgerMenuStructureItem No
Returns : void

Properties

childItems
Type : QueryList<SmartHamburgerMenuItemComponent>
Decorators :
@ViewChildren(SmartHamburgerMenuItemComponent)

Accessors

open
getopen()
Returns : boolean
setopen(value: boolean)
Parameters :
Name Type Optional
value boolean No
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}}&nbsp;&nbsp;<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">
            &nbsp;&nbsp;
        </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;
}
Legend
Html element
Component
Html element with directive

result-matching ""

    No results matching ""