Adding template bindings to the bike-detail page

Now, let's make some adjustments to the bike-detail page template:

  1. Open ./Client/src/app/bikes/bike-detail/bike-detail.component.html.

  2. Replace its content with the following code:
 <main role="main"> <div class="py-5"> <div class="container"> <div *ngIf="isLoading" class="spinner"> <div class="double-bounce1"></div> <div class="double-bounce2"></div> </div> <ngb-tabset type="pills" *ngIf="!isLoading"> <ngb-tab title="Bike Detail"> <ng-template ngbTabContent> <br> <div class="row"> <div class="col-md-4"> <img class="card-img-top" src="{{ bike?.picture }}" alt="Card image cap"> </div> <div class="col-md-8"> <div class="card"> <div class="card-body"> <h5 class="card-title">{{ bike?.model }} ...

Get Hands-On Full Stack Web Development with Angular 6 and Laravel 5 now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial