All modern browsers allow you to inspect the source. And in most cases you can simply right-click on the page and select Inspect Element. In case you are not comfortable with Inspect, you can also do View Source. Refer to the following screenshot:

Building an Address Book App

Tip

By the way, here I’m using Firebug, an awesome add-on for Mozilla Firefox.

As you look through the code, you’ll notice that angularjs is making a fair bit of change to the markup.

The first thing you’ll notice is that angularjs adds a class called ng-scope to every DOM element where the scope is initialized (we will get to what a scope is, in just a bit). It duplicates the entire DOM present within the ng-repeat directive. It is also adding a class called ng-binding to every element where the data is bound.

angularjs will add different CSS classes depending on the directive being used. These can come in handy when you want to style, for example, the validation messages while working with forms. We’ll see more about this in the chapters ahead.

Chapter 2 of 7