The goal of Angular 2 is simple: bring HTML and JavaScript together in a manageable and scalable way in order to build a client application. To do that, Angular 2 uses a component-based approach with supporting entities, such as services and directives being injected into the components at runtime. This approach may seem a bit odd at first, but it allows us to keep a clear separation of concerns and generally maintain a clearer project structure. In order to understand the basics of Angular 2, take a look at the following figure:
The preceding figure presents a simplistic architecture for an Angular 2 application consisting of two components. The center entities are the components. Each component performs data binding and event handling with its template in order to present the user with an interactive UI. Services are created for any other task, such as loading data, performing calculations, and so on. The services are then consumed by the components that delegate...