Improved semantics of the directives syntax
In Chapter 1, Get Going with Angular, we mentioned the opportunity for improved tooling in Angular. A big issue in AngularJS is the different ways in which we can use directives. This requires an understanding of the attribute values, which can be literals, expressions, callbacks, or a microsyntax. Starting with Angular 2, this problem is eliminated by introducing a few simple conventions that are built into the framework:
propertyName="value"
[propertyName]="expression"
(eventName)="handler()"
In the first line, the propertyName
attribute accepts a string literal as a value. Angular will not process the attribute's value any further; it will use it the way it is set in the template.
The second syntax, [propertyName]="expression"
, gives a hint to Angular that the value of the attributes should be handled as an expression. When Angular finds an attribute surrounded by brackets, it will interpret the expression in the context of the component associated...