0

This is the cart-details component html file , on which i am trying to loop items i have received from cart service which my cart-details component ts file has subscribed . I am trying to loop through the items getting the error that the it cannot bind with ng for loop . Please help!

<div class="main-content">
   <div class="section-content section-content-p30">
       <div class="container-fluid">

           <table class="table table-bordered">
               <tr>
                   <th width="20%">Product Image</th>
                   <th width="50%">Product Detail</th>
                   <th width="30%"></th>
               </tr>

               <tr *ngFor="let tempCartItem of cartItems">
                   <td>
                       <img src="{{ tempCartItem.imageUrl }}" class="img-responsive" width="150px" />
                   </td>
                   <td>
                       <p>{{ tempCartItem.name }}</p>
                       <p>{{ tempCartItem.unitPrice  }}</p>
                   </td>
                   <td>
                       <div class="items">
                           <label>Quantity:</label> {{ tempCartItem.quantity }}
                       </div>

                       <p class="mt-2">Subtotal: {{ tempCartItem.quantity *  tempCartItem.unitPrice  }}</p>
                   </td>
               </tr>

               <tr >
                   <td colspan="2"></td>
                   <td style="font-weight: bold">
                       <p>Total Quantity: {{ totalQuantity }}</p>
                       <p>Shipping: FREE</p>
                       <p>Total Price: {{ totalPrice  }}</p>
                   </td>
               </tr>

           </table>

       </div>
   </div>
</div>

1 Answers1

0

NgFor is a structural directive which is located in the CommonModule.

Please import CommonModule and add it in the imports array the module in which you are using NgFor.

Also, you are using ngFor in your code.

Are you sure, you are getting Can't bind to ngForOf error ?

Akhil
  • 1,403
  • 7
  • 19