Chapter 4 ■ Filters and ModulesListing 4-2 shows how easy it is to apply the lowercase filter. We apply it by stating the value we want to filter,
followed by the | (pipe) character and then the name of the filter. The most important aspects of the code are shown
in bold. As Figure 4-1 shows, the first paragraph displays the plain unfiltered data, and the second paragraph displays
the filtered data.
Figure 4-1. lowercase filter—before and after
You won’t be very surprised to learn that there is a built-in filter named uppercase, which, unsurprisingly,
converts characters to uppercase. AngularJS ships with a set of other handy filters, and we look at these in the next
section. However, before we get to them, let’s take a step back and consider why we might want to use filters. After all,
JavaScript already has what you need to perform these kinds of tasks. For example, we could just as easily have added
the code for lowercasing data values directly to the controller, instead of using filters. Listing 4-3 takes this approach,
and it produces the very same result as Listing 4-2.
Listing 4-3. Achieving Same Result Without Filter
Using the approach taken in Listing 4-3, it is true that we bypass the need for filters, but there are a few things
to consider before you choose to adopt this approach. As I discussed in the last chapter, one very good reason to use
AngularJS is because you want to organize your code better and follow some common software development best
practices.