angular2

Question

私はコンポーネントとして、テーブルの行をレンダリングしようとしている

：

<table class="table table-responsive"> 
    <thead> 
     <tr> 
      <th>ID</th> 
      <th>Imię</th> 
      <th>Nazwisko</th> 
      <th>Data od</th> 
      <th>Data do</th> 
      <th>Pokój</th> 
      <th>Typ pokoju</th> 
      <th>Cena</th> 
     </tr> 
    </thead> 
    <tbody> 
     <app-rezerwacja-item 
      *ngFor="let rezerwacjaEl of rezerwacje; let i = index" 
      [rezerwacja]="rezerwacjaEl" 
      [index]="i"> 
     </app-rezerwacja-item> 
    </tbody> 
</table> 

rezerwacja-item-component

しかし、ブラウザはapp-rezerwacja-itemまず、その行をレンダリングし、テーブルは行を行として「見る」ことはできません。彼らはグリッドから外れています。テーブルもクラッシュします。

誰でもお手伝いできますか？

Answer 1

セレクタの一部として 'app-rezerwacja-item'を設定できます。私は、この例では、適応、あなたのコードを持っていなかった。

親HTML

<table> 
     <tbody> 
     <tr app-rezerwacja-item *ngFor="let rezerwacjaEl of rezerwacje; let i = index" 
      [rezerwacja]="rezerwacjaEl" 
      [index]="i"> 
     </tr> 
     </tbody> 
    </table> 

子コンポーネントクラス：リンクを更新

@Component({ 
    selector: 'tr [app-rezerwacja-item]', 
    template: ` 
    <td>{{rezerwacja.name}}</td> 
    ` 
}) 

DEMO