In the last Tech-talk, we discussed the Architecture of Angular2.x., more specifically, how it looks and some of it’s major components. Today we will be discussing all the types of Bindings in Angular.
What are Bindings?
Types of Bindings in Angular 2.x
There are 4 types of Bindings in Angular 2.x
- One way
- Two way
Again One-way binding can be categorized into two parts:
- OBJECT TO UI
- UI TO OBJECT
- One-way binding:
- Object to UI: The square bracket “” represents data flow from Object to UI.
- UI TO OBJECT: The round bracket “()” represents data flow from UI to object. The value is carried over from UI to object by certain events take place in UI.
- Two-way binding:
The above syntax for object to UI and vice-versa i.e. the square and round bracket jointly “[()]” represents two-way binding.
- Template Binding:
The template binding represents by ‘*’.
E.g.: the ‘for’ loop syntax in Angular 2.x represents the template binding. Here a fixed template section is looped to display the data in multiple rows and that’s why we need to put ‘*’ in ‘ngFor’ statement—i.e. ‘*ngFor’.
This is a very small and useful tech-talk related to all the various types of bindings in Angular 2.x. You can use this as a handy information tool. In the subsequent Tech talks we will explore some very interesting features of Angular 2.x. Stay tuned and keep following us! Be sure to email us at firstname.lastname@example.org for more information!