Learn how you can use square brackets to bind properties to your templates in your applications. It's an easy way to access and modify properties within a template.
- [Narrator] Angular provides a way to bind…properties to your template using square brackets…So binding is just another way…of connecting things…With it you can control say a dom property…through a variable or a method in your component.…So let's go ahead and add that…to this application.…What I'm going to do is go into my label here…and let's go ahead and make this wider.…And what I can do here is use square brackets…and target the inner HTML dom property…and go ahead and output the value…of the name property directly from this span.…
Right, so that means that I know longer…need to put it in here…through these brackets.…And let's go ahead and take that out…of there as well.…Let's go ahead and save this.…And now when we click on these…it's actually inputting the text right here…through this inner HTML property…that we capture here.…So we can actually go ahead and add…the word for and colon right here.…So you can see that…when we click it's going to add search for…and then it's going to read the name property…and enter it for us here.…
In this course, Ray Villalobos shows you how to start using Angular 2 in your own projects. He starts by defining what exactly Angular 2 is and how it differs from AngularJS 1. Then, once the basics are out of the way, he sets up the template that will drive the project and starts coding. Ray shows how to divide your project into modules, work with events, style content with CSS, and create components and subcomponents. Plus, you can find out how to change content dynamically using data pipes.
Note: Members can find a template to download in the exercise files.
- What is Angular 2?
- Setting up a template
- Creating a simple component
- Using multiple modules
- Displaying data in templates
- Working with events
- Creating a subcomponent
- Filtering content through data pipes