Searching

Default global search can be enabled using globalSearch property of m-header component.

<m-header title="Countries" globalSearch="true"></m-header>

Searching triggers onFilter event from m-table component.

<m-table [value]=countries
         (onFilter)="onFilter($event)">
</m-table>

SearchField By default search filed is search icon which expand and collapse on click, to change the search field to box use searchField property of m-header component.

<m-header title="Countries" globalSearch="true" searchField="box"></m-header>

Server Side Searching By default search is local, to disable local search and implement custom server side searching use filterLocal property of m-table.

<m-table [value]=countries
filterLocal="false">
</m-table>

Table Component m-table Properties

Name Default Description
@Output()
onFilter
- Emits event on search with filter data.
@Input()
filterLocal: boolean
true whether to search locally or server side.

Header Component m-header Properties

Name Default Description
@Input()
globalSearch: boolean
false Enable global search.
@Input()
searchField: string
'line' whether search field is box or line.

results matching ""

    No results matching ""