@schinfotech/sch-dynamic-search-filter v2.0.3

DynamicSearchFilterLibrary

This library was generated with Angular CLI version 10.2.0.

Basically the library work with angular application having a serach filter can replce witha dynamic searchj filter by giving a template id. And this template id is generic pointing to its definition having the attributes, attributes are nothing but the search field need to be appeared.

<sch-dynamic-search-filter fxFlex=100 params="" templateId="" accessToken="" (searchChange)="searchchange($event)" position="'top'" isReset="">

Properites need to be replaced with its value.

Steps for integrating the library

1. Identify the search filter to get replace with the dynamic search filter library
2. Get Host application id, tenant id, params required to pass the attribute definition. The Host application id and the tenant id can be get from the given access token.
3. Define Attributes in the admin panel along the user group
4. Create template and map the associated attributes
5. Import the SchDynamicSearchFilterModule in the feature module
6. NgModule class -> import SchDynamicSearchFilterModule.forRoot(environment.apiUrl), the apiUrl should be the url which is having the attribute / template definition
7. Import the depency packages
   "@angular/common": "^10.2.0", "@angular/core": "^10.2.0", "@angular/flex-layout": "^11.0.0-beta.33", "@angular/material": "^10.2.7", "ng5-slider": "^1.2.6", "ngx-perfect-scrollbar": "^10.0.1", "ngx-mat-select-search": "^3.2.0", "ng-mat-select-infinite-scroll": "2.1.1"
8. Get the template Id
9. Replace the search filter component with the provided properties.
10. Define the searchChange method to get the dynamic search value in the component
11. position value set to 'top' can bring the corresponding style, if the search filter is placing top of the page, default it can be set blank
12. isReset key set to true, if the reset button in the search filter is clicked, by default its false

Code scaffolding

Run ng generate component component-name --project sch-dynamic-search-filter to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module --project sch-dynamic-search-filter.

Note: Don't forget to add --project sch-dynamic-search-filter or else it will be added to the default project in your angular.json file.

Installation

npm install @schinfotech/sch-dynamic-search-filter

Dependency Packages

Dont forget to install the below packages in order to work the library

"@angular/common": "^10.2.0", "@angular/core": "^10.2.0", "@angular/flex-layout": "^11.0.0-beta.33", "@angular/material": "^10.2.7", "ng5-slider": "^1.2.6", "ngx-perfect-scrollbar": "^10.0.1", "ngx-perfect-scrollbar": "^10.0.1", "ng-mat-select-infinite-scroll": "2.1.1", "ngx-mat-select-search": "^3.2.0"