Menu Service

The data format is an array of Menu, where text text property muse be required, And it's not affected by external components (such as sidebar-nav),

This is because menus it's essential part of the applications, And it can be used more effectively as a service, such as: dynamically generate navigation, title etc.

Suggest: Start up Angular (startup.service.ts) After get menu data from remote, call the add() method.

API

MethodParameterDescription
additems: Menu[]Setting menu data
clear-Clear menu data
resumecallback: FunectionReset menu, may need call when I18N, user acl changed
openedByUrlurl, recursive = falseSet menu _open attribute by URL (_open expands the submenu)
getPathByUrlurl, recursive = falseGet menu list based on url

recursive

Recursive upward find, for example, the menu data source contains /ware, then /ware/1 is equivalent to /ware.

PropertyDescriptionTypeDefault
textText of menu item, can be choose one of text or i18n (Support HTML)string-
i18nI18n key of menu item, can be choose one of text or i18n (Support HTML)string-
groupWhether to display the group namebooleantrue
linkRouting for the menu item, can be choose one of link or externalLinkstring-
externalLinkExternal link for the menu item, can be choose one of link or externalLinkstring-
targetSpecifies externalLink where to display the linked URL_blank,_self,_parent,_top-
iconIcon for the menu item, only valid for the first level menustring | MenuIcon-
badgeBadget for the menu item when group is truenumber-
badgeDotWhether to display a red dot instead of badge valueboolean-
badgeStatusBadge colorsuccess,processing,default,error,warningerror
disabledWhether disable for the menu itembooleanfalse
hideWhether hidden for the menu itembooleanfalse
hideInBreadcrumbWhether hide in breadcrumbs, which are valid when the page-header component automatically generates breadcrumbsboolean-
aclACL configuration, it's equivalent to ACLService.can(roleOrAbility: ACLCanType) parameter valueany-
shortcutWhether shortcut menu itemboolean-
shortcutRootWheter shortcut menu root nodeboolean-
reuseWhether to allow reuse, need to cooperate with the reuse-tab componentboolean-
openWhether to expand, when checkStrictly is valid in sidebar-nav componentboolean-
keyUnique identifier of the menu item, can be used in getItem, setItem to update a menustring-
childrenChildren for the menu itemMenu[]-
PropertyDescriptionTypeDefault
[type]Type for icon; img, svg Size uses 14px width and heightclass,icon,iconfont,img,svgicon
[value]Value for the icon, can be set Class Name, nz-icon of nzType, imagestring-
[theme]Type of the ant design iconoutline,twotone,filloutline
[spin]Rotate icon with animationbooleanfalse
[twoToneColor]Only support the two-tone icon. Specific the primary colorstring-
[iconfont]Type of the icon from iconfontstring-
[rotate]Rotate degreesnumber-