@progress/kendo-angular-menu
Version:
Kendo UI Angular Menu component
98 lines (97 loc) • 3.8 kB
TypeScript
/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
import { QueryList, TemplateRef } from '@angular/core';
import { ItemTemplateDirective } from './templates/item-template.directive';
import { ItemLinkTemplateDirective } from './templates/item-link-template.directive';
import { ItemContentTemplateDirective } from './templates/item-content-template.directive';
import { MenuItem } from './menu-item.interface';
import { SVGIcon } from '@progress/kendo-svg-icons';
import * as i0 from "@angular/core";
/**
* Represents a component that can be used to specify the Menu items
* ([more information and examples]({% slug items_menu %})).
*
* @example
* ```html
* <kendo-menu>
* <kendo-menu-item text="item1">
* <kendo-menu-item text="item1.1" url="https://example.com">
* </kendo-menu-item>
* <kendo-menu-item text="item1.2" [disabled]="true">
* </kendo-menu-item>
* </kendo-menu-item>
* <kendo-menu-item text="item2">
* <ng-template kendoMenuItemContentTemplate let-item="item">
* <div style="padding: 10px;">
* My Content Template: {{ item.text }}
* </div>
* </ng-template>
* <ng-template kendoMenuItemTemplate let-item="item">
* <div style="padding: 10px;">
* My Template: {{ item.text }}
* </div>
* </ng-template>
* </kendo-menu-item>
* <kendo-menu-item text="item3">
* <ng-template kendoMenuItemLinkTemplate let-item="item" let-index="index">
* <span [kendoMenuItemLink]="index">
* {{ item.text }}
* @if (item.items && item.items.length) {
* <span [kendoMenuExpandArrow]="index"></span>
* }
* </span>
* </ng-template>
* </kendo-menu-item>
* </kendo-menu>
* ```
*
* @remarks
* Supported children components are: {@link MenuItemComponent}.
*/
export declare class MenuItemComponent implements MenuItem {
text: string;
url: string;
disabled: boolean;
cssClass: any;
cssStyle: any;
icon: string;
svgIcon: SVGIcon;
data: any;
separator: boolean;
/**
* @hidden
*/
itemTemplate: QueryList<ItemTemplateDirective>;
/**
* @hidden
*/
itemLinkTemplate: QueryList<ItemLinkTemplateDirective>;
/**
* @hidden
*/
itemContentTemplate: QueryList<ItemContentTemplateDirective>;
/**
* @hidden
*/
children: QueryList<MenuItemComponent>;
/**
* @hidden
*/
get template(): TemplateRef<any>;
/**
* @hidden
*/
get linkTemplate(): TemplateRef<any>;
/**
* @hidden
*/
get contentTemplate(): TemplateRef<any>;
/**
* @hidden
*/
get items(): any[];
static ɵfac: i0.ɵɵFactoryDeclaration<MenuItemComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<MenuItemComponent, "kendo-menu-item", never, { "text": { "alias": "text"; "required": false; }; "url": { "alias": "url"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "cssClass": { "alias": "cssClass"; "required": false; }; "cssStyle": { "alias": "cssStyle"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "svgIcon": { "alias": "svgIcon"; "required": false; }; "data": { "alias": "data"; "required": false; }; "separator": { "alias": "separator"; "required": false; }; }, {}, ["itemTemplate", "itemLinkTemplate", "itemContentTemplate", "children"], never, true, never>;
}