0

テーブルテンプレートを持つコンポーネントがあります。

これは一部です：

<tr *ngFor="let stat of statistic" class="stripped">
        <td>{{stat.date         | date:"shortDate"}}</td> 
        <td>{{stat.hits         | number }}</td>
        <td>{{stat.unique       | number }}</td>
        <td>{{stat.registrations| number }}</td>
        <td>{{stat.conversion   | number }}</td>
        <td>{{stat.deposit      | number }}</td>
        <td>{{stat.ftd          | number }}</td>
        <td class="bold">{{stat. deals | number }}</td>
        <td class="bold colored">{{stat.profit| currency:'USD':true:'1.2' }}</td>
</tr>

しかし、tr の代わりに 2 つ挿入する必要があります。別の部品として使用しようとすると、テーブルが壊れます。

サイクル内の各 tr の後に別の tr を挿入するトリッキーな方法はありますか? または、彼のテンプレートにコンポーネントセレクターを交換する方法があるかもしれません

4

2 に答える 2

1

コメントで言ったように、同じデータを使用したいが、2つ欲しいtrので、これを試すことができます:-

<template ngFor let-stat [ngForOf]='statistic'>
    <tr class="stripped">
        <td>{{stat.date | date:"shortDate"}}</td>
        <td>{{stat.hits | number }}</td>
        <td>{{stat.unique | number }}</td>
        <td>{{stat.registrations| number }}</td>
        <td>{{stat.conversion | number }}</td>
        <td>{{stat.deposit | number }}</td>
        <td>{{stat.ftd | number }}</td>
        <td class="bold">{{stat. deals | number }}</td>
        <td class="bold colored">{{stat.profit| currency:'USD':true:'1.2' }}</td>
    </tr>
    <tr class="stripped">
        <td>{{stat.date | date:"shortDate"}}</td>
        <td>{{stat.hits | number }}</td>
        <td>{{stat.unique | number }}</td>
        <td>{{stat.registrations| number }}</td>
        <td>{{stat.conversion | number }}</td>
        <td>{{stat.deposit | number }}</td>
        <td>{{stat.ftd | number }}</td>
        <td class="bold">{{stat. deals | number }}</td>
        <td class="bold colored">{{stat.profit| currency:'USD':true:'1.2' }}</td>
    </tr>
</template>

angular2で* ngForを使用するよりトリッキーな方法については、こちらを参照して ください https://angular.io/docs/ts/latest/api/common/NgFor-directive.html

于 2016-05-28T05:17:31.807 に答える
0

あなたはtbodyを使うことができます

<tbody *ngFor="let stat of statistic" class="stripped">
   <tr></tr>
   <tr></tr>
</tbody>

この回答から、テーブルに複数の tbody を含めることができます。

テーブルの代わりにブートストラップ グリッド システムを使用すると、このトリックを実行できます。

于 2016-05-28T05:10:49.513 に答える