Angular EasyUI 分割按鈕

分割按鈕（ SplitButtonComponent ）與菜單按鈕（ MenuButtonComponent ）相似，也與鏈接按鈕（ LinkButtonComponent ）和菜單（ MenuComponent ）相關。 分割按鈕（ SplitButtonComponent ）與菜單按鈕（ MenuButtonComponent ）不同點在于分割按鈕（ SplitButtonComponent ）被分割為兩部分。當鼠標懸停在分割按鈕（ SplitButtonComponent ）上，將顯示一條分割線。只有當鼠標懸停在按鈕右側部分才會顯示菜單（ MenuComponent ）。

使用方法

<eui-splitbutton [menu]="edit" [plain]="true" iconCls="icon-edit">Edit</eui-splitbutton>
<eui-menu #edit>
    <eui-menu-item text="Undo" iconCls="icon-undo"></eui-menu-item>
    <eui-menu-item text="Redo" iconCls="icon-redo"></eui-menu-item>
    <eui-menu-sep></eui-menu-sep>
    <eui-menu-item text="Cut"></eui-menu-item>
    <eui-menu-item text="Copy"></eui-menu-item>
    <eui-menu-item text="Paste"></eui-menu-item>
    <eui-menu-sep></eui-menu-sep>
    <eui-menu-item text="Toolbar">
        <eui-submenu>
            <eui-menu-item text="Address"></eui-menu-item>
            <eui-menu-item text="Link"></eui-menu-item>
            <eui-menu-item text="Navigation Toolbar"></eui-menu-item>
            <eui-menu-item text="Bookmark Toolbar"></eui-menu-item>
            <eui-menu-sep></eui-menu-sep>
            <eui-menu-item text="New Toolbar..."></eui-menu-item>
        </eui-submenu>
    </eui-menu-item>
    <eui-menu-item text="Delete" iconCls="icon-remove"></eui-menu-item>
    <eui-menu-item text="Select All"></eui-menu-item>
</eui-menu>

• 菜單（ MenuComponent ）豐富了分割按鈕（ SplitButtonComponent ）的功能性。參考圖例：

注：
- 繼承： MenuButtonComponent 。
- 選擇器： eui-splitbutton 。