Angular templates
Templates can be analyzable, transformable, and declarative in a way that JavaScript fundamentally cannot be. When designing Angular we put a lot of effort to make sure the template language has these properties. Let's look at what we ended up with.
Property and event bindings
Input and output properties are the public API of a directive. Data flows into a directive via its inputs and flows out via its outputs. We can update input properties using property bindings. And we can subscribe to output properties using event bindings.
Say we have a component that renders a button that allows rating a conference talk. We could use this component in our template as follows:
<rate-button[talk]="myTalk"(rate)="handleRate($event)"></rate-button>
This tells Angular that whenever myTalk
changes, Angular needs to automatically update the rate-button
component by calling the setter. This also tells Angular that if an event called rate
is fired, it should invoke handleRate
.
Now,...