Templates, Directives, and Data Binding

Go back to Tutorial

A template combines HTML with Angular markup that can modify the HTML elements before they are displayed. Template directives provide program logic, and binding markup connects your application data and the document object model (DOM).

• Event binding lets your app respond to user input in the target environment by updating your application data.
• Property binding lets you interpolate values that are computed from your application data into the HTML.

Before a view is displayed, Angular evaluates the directives and resolves the binding syntax in the template to modify the HTML elements and the DOM, according to your program data and logic. Angular supports two-way data binding, meaning that changes in the DOM, such as user choices, can also be reflected back into your program data.

Your templates can also use pipes to improve the user experience by transforming values for display. Use pipes to display, for example, dates and currency values in a way appropriate to the user’s locale. Angular provides predefined pipes for common transformations, and you can also define your own.

Go back to Tutorial