* ngFor для печати только первого элемента массива

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 элемента, как я могу выбрать печать первого или второго элемента без печати обоихих?Мне нужно сделать это, так как я должен поместить их обоих в отдельные элементы.

Answer 1

Я предполагаю, что строка, которая относится к массиву массивов, является доской советов 1.

Попробуйте обернуть каждый массив в ng-контент, имеющий директиву ngIf, следующим образом:

<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>

Возможно, вам придется повторить некоторый код, но он должен работать.