From the course: Angular: Creating and Hosting a Full-Stack Site

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Create a Listing Detail page

Create a Listing Detail page

From the course: Angular: Creating and Hosting a Full-Stack Site

Start my 1-month free trial

Create a Listing Detail page

- [Instructor] So now that we've got our listings page working and linking to the corresponding detail page for each listing, it's time to actually implement the listing-detail-page. So let's open up our listing-detail-page TypeScript and HTML files and before we begin here, there's something to know about this page. Remember that earlier when we were creating the routes for our applications, there were several routes that we created with this ID URL parameter thing. Now, you may have noticed that when we navigate from our listings-page to our listing-detail-page, the URL that we're navigating to contains the ID of the individual listing that we clicked on. So what we're going to have to do on this page is somehow get access to the value of this part of the URL and use that to display the corresponding listing from our fake listings array on our page. So here's how we do that in Angular. Let's open up our TypeScript file…

Contents