Question

我正在使用以下代码：

   <div *ngIf="gamedata.notOver" class="columns">
                <div class="column has-text-centered" *ngFor="let board of boards; let i = index">
                    <table class="is-bordered" [style.opacity]="i == player ? 0.5 : 1">
                        <tr *ngFor="let row of board.tiles; let j = index">
                            <td *ngFor="let col of row; let k = index" (click)="boardListener($event)" [style.background-color]="col.used ? '' : 'transparent'" [class.win]="col.status == 'win'" [class.fail]="col.status !== 'win'" class="battleship-tile" id="t{{i}}{{j}}{{k}}">
                                {{ col.value == "1" ? (col.status == "hit" ? "" : "X") : (col.status == "miss" ? "⛶" : (col.status == "hit" ? "" : "")) }}
                            </td>
                        </tr>
                    </table>
                    <hr>
                </div>
   </div>

要打印包含2个元素的数组的第一个元素，我如何选择打印第一个或第二个元素而不打印两个元素？我需要这样做，因为我必须将它们都放在单独的div中。

Answer 1

我假设引用数组数组的那一行是一块木板。

尝试将每个数组包装在具有ngIf指令的ng-content中，如下所示：

<div class="column has-text-centered" *ngFor="let board of boards; let i = index">
    <ng-content *ngIf="i%2 == 0">
        INSERT WHAT YOU WANT TO DISPLAY FOR FIRST ARRAY ITEM HERE
    </ng-content>
    <ng-content *ngIf="i%2 != 0">
        INSERT WHAT YOU WANT TO DISPLAY FOR SECOND ARRAY ITEM HERE
    </ng-content>
</div>

您可能必须重复一些代码，但是应该可以。

* ng仅打印数组的第一个元素

1 个答案: