This video covers adding another component. See how multiple components work in a more complex application.
- [Instructor] Creating sub-components…is a pretty common task,…and also sub-components can take care of some things…that we would normally have to use routes for,…for example, displaying different sections of our page.…So, I'm going to show you how to do a second sub-component,…and to do that let's go ahead and in the App folder…we'll go ahead and create a new file.…We'll create a new sub-component…called component.artist-details.ts,…and just like with other components,…we'll go ahead and and import the component module…from the Angular Core Library.…
Let's go ahead and make this bigger.…Next we can use the decorator…to define how this component is going to work.…So this gets a configuration object,…and in here we're going to declare a selector…and that selector is the name of the HTML tag…that we're going to use to call this component.…So the job of this component is to display…a more detailed view when you click on each artist's name.…So we'll call this artist-details,…and we'll declare a template URL, and we'll call this…
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