From the course: Angular: Testing and Debugging

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Adding a custom Angular pipe

Adding a custom Angular pipe - Angular Tutorial

From the course: Angular: Testing and Debugging

Start my 1-month free trial

Adding a custom Angular pipe

“

- [Instructor] Pipes let you change how Angular displays data in your app. They're great for things like making text uppercase and turning decimals into percents. They're also great for quickly localizing numbers and date formats. You can even use pipes to work directly with promises and observables. Check out Angular's website for a full list of built-in pipes and how they work. Let's add a feature in our app that highlights the filter string found in each name. A custom Angular pipe is an excellent choice for this kind of feature. We'll use the ng generate command to generate a new file for our pipe. I'll go up to the terminal menu, click on new terminal and then I'll type ng generate pipe and hit Enter. Angular is going to ask us what we want to name the pipe. You can name your file whatever you'd like. I'm going to call mine highlight text and I'm going to put it in a new pipes folder in the app directory. I do that by typing pipes/highlight-text and hitting Enter. Check out my…

Contents