Chapter 4 ■ Filters and Modules
The first filter we will look at will address the issue of the firstName and surname appearing in uppercase.
To improve this slightly, we will change it to lowercase. To achieve this, the main thing to know is that you use the
| (pipe) character, to invoke a filter. Later in this chapter, we will look at how to improve upon this even further, by
leaving the first character in uppercase and converting only the remaining characters to lowercase, a technique
known as title casing.
Listing 4-2 shows how this is done. The MyFilterDemoCtrl controller’s only task here is to make the data available
to the view. As you will recall from the last chapter, placing it in the scope does this.
Listing 4-2. Angular Filter Example
<!DOCTYPE html>
First Name: {{data.firstName}}
Surname: {{data.surname}}
First Name: {{data.firstName | lowercase}}
Surname: {{data.surname | lowercase }}