ANGULAR 20.3.18 - SEARCH AND PAGINATION - CUSTOM FILTER USING PIPE
ANGULAR 20.3.18 Employee Search with Pagination 🔷 1. Overview This feature allows users to: ✔ Search employees by Name, Designation, or Contact ✔ View results with Pagination ✔ Perform search without calling API again (client-side filtering) 🔷 2. Technologies Used Angular 20 (Standalone Components) Template Driven Forms ( ngModel ) Custom Pipe ( filterEmployees ) ngx-pagination 🔷 3. Service Layer (Data Fetching) 📌 What? Fetch employee data from API and store in service. 📌 Why? Centralized data storage Avoid multiple API calls 📌 Code getAllEmployees (): void { this . httpClient . get< any >( environment . apiUrl + 'Employees' ) . subscribe({ next: response => { this . employees = response . $values; } }); } 🔷 4. Component Layer (UI Control) 📌 What? Calls service Holds search input Displays data 📌 Code searchTerm : string = '' ; p : number = 1 ; itemsPerPage : number ...