A conceptual overview of Angular

Before we dive into the different parts of Angular, let's get a conceptual overview of how everything fits together. Let's take a look at the following diagram:

Figure 1

Figure 1 to Figure 4 show the main Angular concepts and the connections between them. The main purpose of these diagrams is to illustrate the core blocks for building single-page applications with Angular, and their relations.

Component is the main building block we will use to create the user interface of our applications with Angular. The Component block is a direct successor of directive, which is the primitive for attaching behavior to the DOM. Components extend directives by providing further features, such as a template, which can be used to render composition of directives. Inside the template, different expressions can reside:

Figure 2

The preceding diagram...