SmartComponent Library NG
  1. Components
  2. SmartToolbarMenuComponent

File

src/ui/menu/smart-toolbar-menu/smart-toolbar-menu.component.ts

Extends

AbstractSmartComponent

Metadata

providers SmartMenuStructureService
selector smart-toolbar-menu
styleUrls ./smart-toolbar-menu.component.css
templateUrl ./smart-toolbar-menu.component.html

Index

Properties
Inputs
Outputs
Accessors

Constructor

constructor(smartMenuStructureService: SmartMenuStructureService)
Parameters :
Name Type Optional
smartMenuStructureService SmartMenuStructureService No

Inputs

disableFirstLevelIcons
Type : boolean
expanded
Type : boolean

If set to true, will expand the menu on initialization.
menu-structure-code
Type : string

The structure code that the Smart Menu should use.

Outputs

selected-item-changed
Type : EventEmitter<any>

Fires when the menu's selection changes.

Properties

_extraItems
Type : QueryList<SmartMenuItemDirective>
Decorators :
@ContentChildren(SmartMenuItemDirective)
menuItems
Type : (SmartMenuStructureItem | SmartMenuItemDirective)[]

Accessors

extraItems
getextraItems()
Returns : SmartMenuItemDirective[]
hasExtraItems
gethasExtraItems()
Returns : boolean 
<kendo-menu>
    <kendo-menu-item *ngFor="let item of menuItems" [text]="item.title" [cssStyle]="item.cssStyle" [cssClass]="item.cssClass">
        <ng-template kendoMenuItemTemplate>
            <SmartToolbarMenuItemRenderer cssClass="smart-toolbar-menu-item-header" [item]="item" [showIcon]="!disableFirstLevelIcons"></SmartToolbarMenuItemRenderer>
        </ng-template>
        <ng-container *ngIf="!!item.children && item.children.length > 0">
            <kendo-menu-item *ngFor="let firstChild of item.children" [cssStyle]="item.cssStyle" [cssClass]="item.cssClass">
                <ng-template kendoMenuItemTemplate>
                    <SmartToolbarMenuItemRenderer cssClass="smart-toolbar-menu-item-label" [item]="firstChild" showIcon="true"></SmartToolbarMenuItemRenderer>
                </ng-template>
                <ng-container *ngIf="!!firstChild.children && firstChild.children.length > 0">
                    <kendo-menu-item *ngFor="let grandChild of firstChild.children" [cssStyle]="item.cssStyle" [cssClass]="item.cssClass">
                        <ng-template kendoMenuItemTemplate>
                            <SmartToolbarMenuItemRenderer cssClass="smart-toolbar-menu-item-label" [item]="grandChild" showIcon="true"></SmartToolbarMenuItemRenderer>
                        </ng-template>
                    </kendo-menu-item>
                </ng-container>
            </kendo-menu-item>
        </ng-container>
    </kendo-menu-item>
    <ng-content></ng-content>
    <!--
    <ng-container *ngIf="hasExtraItems">
        <kendo-menu-item *ngFor="let extraItem of extraItems" [text]="' '">
            <ng-template kendoMenuItemTemplate>
                <div></div>
                <SmartToolbarMenuItemRenderer [templateItem]="extraItem"></SmartToolbarMenuItemRenderer>
            </ng-template>
                <kendo-menu-item *ngFor="let child of extraItem.children" [text]="' '">
                    <ng-template kendoMenuItemTemplate>
                        <div></div>
                        <SmartToolbarMenuItemRenderer [templateItem]="child"></SmartToolbarMenuItemRenderer>
                    </ng-template>
                </kendo-menu-item>
        </kendo-menu-item>
    </ng-container>
-->
</kendo-menu>

./smart-toolbar-menu.component.css

Legend
Html element
Component
Html element with directive

result-matching ""

    No results matching ""