From the course: Angular: Creating and Hosting a Full-Stack Site
Unlock the full course today
Join today to access over 24,800 courses taught by industry experts.
Implement the Listings page
From the course: Angular: Creating and Hosting a Full-Stack Site
Implement the Listings page
- [Instructor] Now that we've got all of that setup out of the way, let's start implementing our listings page component. Remember that this page is going to display a list, showing all the available listings on our site. Now in reality, our site might have thousands of listings, and in this case, we definitely want to paginate our results, but in this course, we're going to ignore that and just display all our listings on a single page. So here's what implementing our listings page is going to look like. It's going to involve making changes to two files here, our listings page TypeScript file, and our listings page HTML file. So let's open both of those files up. Now there's really only one main thing we'll want to do inside the TypeScript file for now, and that's defined a listings array to contain the listings that we want to display. So up at the top of our component, let's define this variable. We're going to say…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Contents
-
-
-
Why Angular?3m 5s
-
(Locked)
Set up an Angular project2m 4s
-
(Locked)
Angular project structure3m 47s
-
(Locked)
Create your first Angular component2m 55s
-
(Locked)
Routes and routing in Angular9m 45s
-
(Locked)
Add fake data3m 3s
-
(Locked)
Implement the Listings page5m 13s
-
(Locked)
Create a Listing Detail page5m 33s
-
(Locked)
Create a Contact Seller page9m 5s
-
(Locked)
Create a My Listings page4m 27s
-
(Locked)
Create a New Listings page5m 47s
-
(Locked)
Create a Listing Data form3m 57s
-
(Locked)
Create an Edit Listing page11m 14s
-
(Locked)
Create a navigation bar3m 1s
-
-
-
-
-
-
-