Platform: Filter Bar Component V1.0 Technical Design

Filter Bar Component

Summary

The filter bar filters item lists and tables according to various filter criteria. You can use it for both simple and complex lists, regardless of their size. To handle complex lists with multiple filters, the filter bar provides predefined, customizable filter sets (variants).

Design

<fdp-filter-bar
    [id]="bar Id"
    [title]="bar title"
    [show/hide advanced]="true|false"
    [showSearch]="true|false"
    [showClear]="true|false"
    [showGo]="true|false"
    [showRestore]="true|false">
                        <ng-content></ng-content>
</fdp-filter-bar>

Property Bindings

id: string

id of the bar it is optional.

[title]="bar title"

Title of the filter bar

[show/hide advanced]="true|false"

shows(expand) and hides(collapse) the advanced filter options

[showSearch]="true|false"

show or hide the search option.

[showClear]="true|false"

show or hide the clear button.

[showGo]="true|false"

show or hide the GO button.

[showGo]="true|false"

show or hide the Restore button.

Event Bindings

Template:

Two-Way Bindings

N/A

Content Projection

N/A

Interfaces and Types

Are used along with this component.

Information:

Sushma: in ng-content is place holder for filter items.

Questions: