Angular (2/4)Angular is a Java Script Framework. It allows us to create dynamic or reactive Single Page Applications (SPAs).
Architecture of Angular FrameworkBelow is the basic architecture of the Angular application framework :
A module is a group of Component, Services, Directives etc. It can be combined with other modules to create a fully functional Single Page Application.
Angular provides a root module which is NgModule.
ComponentA component is a view in single page application like Navigation, Data List, List Details etc. Each component has a defined template which can communicate with the component class.
TemplateEach component is associated with a template which is kind of HTML page. Template basically tells angular how to render the component.
MetadataA Metadata is a decorator which tells angular how to process the class like which template will be used for the component etc.
Data BindingData binding is a process of coordinating between parts of template and component. For e.g. binding the input text control of template with the property of component.
DirectiveDirective is just like the Component but Components have their own view (Templates). Directives are designed to extend or modify the behavior of existing elements and components.
There are two types of directives
1. Structural directives – change the DOM layout.
2. Attribute directives – change the appearance or behavior of an element, component or directive.
What is ServiceA service is basically a class designed to serve a specific purpose like logging, data service etc. Services can be injected to the components to perform some operations. It basically uses the concept of Dependency Injection.
What is Dependency InjectionDI is basically a way to provide the instance of a class whenever required. Instances are injected to the required class.
When Angular creates a component, it first asks an injector for the services that the component requires.