Angular EasyUI 搜索框

搜索框（ SearchBox ）用于提示用户输入搜索值。它可以结合一个菜单，允许用户选择不同的搜索类别。当用户按下 ENTER 键或者点击组件右侧的搜索按钮时，搜索动作将被执行。

属性列表

名称	数据类型	作用描述	默认值
value	string	搜索字段值。	null
category	any	从菜单项检索类别值。	null
menu	MenuComponent	菜单组件。	null
menuAlign	string	菜单对齐。可选值：'left', 'right'。	left
buttonAlign	string	搜索按钮对齐，可选值：'left', 'right'。	right
buttonlconcls	string	搜索按钮图标样式类。	icon-search

事件列表

名称	参数	作用描述
search	value:string, category:any	搜索时触发。

注：
- 继承： InputBaseComponent 。
- 选择器： eui-searchbox 。

使用方法

<eui-searchbox #sb style="width:300px"
        placeholder="Input something here" 
        [menu]="m1"
        (search)="onSearch($event)">
    <eui-addon>
        <span *ngIf="sb.value!=null" class="textbox-icon icon-clear" title="Clear value" (click)="sb.value=null"></span>
    </eui-addon>
</eui-searchbox>
<eui-menu #m1>
    <eui-menu-item value="all" text="All News" iconCls="icon-ok"></eui-menu-item>
    <eui-menu-item value="sports" text="Sports News" iconCls="icon-man"></eui-menu-item>
</eui-menu>