разверните и сверните ряды в угловых 7 с * ngfor - PullRequest
Новая
       10

разверните и сверните ряды в угловых 7 с * ngfor

0 голосов
/ 06 февраля 2019

В моем шаблоне я использую * ngFor и отображаю детали в таблице.Когда я нажимаю на строку, он должен предоставить дополнительную информацию об этой строке.

В настоящее время я отображаю детали после таблицы, как я могу отобразить под соответствующей сейчас.Я знаю, что должен использовать коллапс из начальной загрузки, но не знаю, как этого добиться.

<table class="table" style="text-align:center">
    <thead>
       <tr>
           <th scope="col">Sender </th>
           <th scope="col">Receiver </th>
           <th scope="col">Shipment</th>
      </tr>
   </thead>
     <tbody>
       <tr *ngFor ="let order of Orders|filter : search" (click) = 
           "details(order.id)"  class="cursorstyle">
              <td>       {{ order.user | titlecase }}    </td> 
              <td>       {{ order.user | titlecase }}    </td> 
              <td>        {{ order.lane.Daddress | titlecase }}   </td> 
       </tr>              
     </tbody>
  </table>
    <div *ngIf = "detailvisible">
        <div *ngIf = "orderdetails"> 
                  //display details orderdetails 
        </div> 
    </div>

Машинопись: 

      details(id:number){

          this.detailvisible = !this.detailvisible;
          this.displayservice.getorderdetails(id).subscribe(data => 
          this.orderdetails = data);

 }
...