app-app-menu.ts

import { Component, Input, Output, EventEmitter } from '@angular/core';

/**
 * 默认应用菜单部件样式
 *
 * @export
 * @class AppQuickMenu
 */
@Component({
    selector: 'app-app-menu',
    templateUrl: './app-app-menu.html',
    styleUrls: ['./app-app-menu.scss']
})
export class AppQuickMenu {

    /**
     * 菜单数据
     *
     * @type {any[]}
     * @memberof AppQuickMenu
     */
    @Input()
    items: any[] = [];
    /**
     * 菜单部件标题
     *
     * @type {string}
     * @memberof AppQuickMenu
     */
    @Input()
    title: string;
    /**
     * 一行显示的列数
     *
     * @type {number}
     * @memberof AppQuickMenu
     */
    @Input()
    numCol: number = 4;
    /**
     * 是否为圆的图标
     *
     * @type {boolean}
     * @memberof AppQuickMenu
     */
    @Input()
    round: boolean = false;
    /**
     * 菜单点击事件
     *
     * @type {EventEmitter<string>}
     * @memberof AppQuickMenu
     */
    @Output()
    menuClick: EventEmitter<string> = new EventEmitter();

    /**
     * 菜单点击
     *
     * @param {string} appFuncId
     * @memberof AppQuickMenu
     */
    public onClick(appFuncId: string): void {
        this.menuClick.emit(appFuncId);
    }
}