DEV Community

Cover image for Creating a Search Filter in Angular

Creating a Search Filter in Angular

Idris Rampurawala on May 07, 2020

Consider a scenario where we have a long list of data being displayed to the user on UI. It would be cumbersome for the user to search for any part...
Collapse
 
othmangueddana profile image
Othman-Gueddana

thank you man <3

Collapse
 
raulriv profile image
Raúl Rivero

Hey! Nice tutorial mate, learned a lot about it. The highlight feature does not work for angular 12(no idea why). Cloned the project and tested it in Angular 11 and 12 and it only works in <12. Is there anything I can do for it to work in Angular 12?

Collapse
 
idrisrampurawala profile image
Idris Rampurawala

Thanks for reading it. Glad you liked it. I'll try to check this issue. You can log it as an issue in GitHub.

Collapse
 
vladyn profile image
Vladimir Varbanov

I'm getting an error: NG9: Property 'c' does not exist on type 'AppComponent'. Since the c is not in the AppComponent.

Collapse
 
vladyn profile image
Vladimir Varbanov

Sorry, my bad :) I missed some property mapping in my example :)

Collapse
 
afifalfiano profile image
Afif Alfiano

Tenkyu

Collapse
 
ajinkyakatre profile image
Ajinkya Katre

if there are no results found how to show it.

Collapse
 
ownvrgs24 profile image
Owen Jasper Vargas

Thank you!

Collapse
 
vickyadi3 profile image
vickyadi3

after text filter it need to be selected in input box while selecting search result, how we achieve in this?

Collapse
 
inderoffcial profile image
inderoffcial

Hi can you explain how can we create Filter pipe for multiple columns and if some columns have null value.
TIA

Collapse
 
gusgonnet profile image
Gustavo

wow, Idris, you explained it so well and I just implemented this on my app in minutes thanks to your post - THANK YOU! you rock

Collapse
 
idrisrampurawala profile image
Idris Rampurawala

Hey Gustavo,

Thanks for reading the article and for the compliments 😁

Collapse
 
vladyn profile image
Vladimir Varbanov

BTW, just an idea, but it would be nice to have a counter, counting the words matched :)

Collapse
 
charleshenricastaing profile image
charleshenricastaing • Edited

Hi, thanks for your post.
I'd tried to implement it but console return me this.
How can i do to fix this problem?

Collapse
 
idrisrampurawala profile image
Idris Rampurawala

Hi,

Thanks for reading the article. Could you please share the screenshot of the console error to understand the problem you are facing? Also, try cloning this repo in your machine and check if it's working and you can then replicate the same in your project 😁

Collapse
 
johnabraham1 profile image
johnabraham1

Nice tutorial. How about the pagination and showing filtered records count? Can we achieve it?