Переключить информацию о строке таблицы, которая не находится на том же уровне - PullRequest
0 голосов
/ 19 июня 2020

Я пытаюсь использовать NgbCollapse для переключения строки таблицы, но мне это не удалось, вот моя реализация:

<table class="table">
    <tbody>
        <tr *ngFor="let game of games; let i = index">

                    <ng-container *ngIf="mainItem ==true">
 <td>
            <button (click)="game.Related = !game.Related" class="btn btn-outline-primary btn-block"  [attr.aria-expanded]="!game.Related" [attr.aria-controls] = "'collapse-' + i">Toggle</button>
        </td>
                        <td>{{game.date}}</td>
                        <td>{{game.label}}</td>
                        <td>{{game.score}}</td>
                    </ng-container>
     <ng-container *ngIf="relatedItems ==true" [ngbCollapse]="game.Related"> // here is the problem game.Related value is not same as in the ngContainer of mainItem
                        <td>{{game.date}}</td>
                        <td>{{game.label}}</td>
                        <td>{{game.score}}</td>
                    </ng-container>

        </tr>
    </tbody>
</table>

цель - когда пользователь нажимает Toggle в основном элементе, который он должен загрузить связанные элементы в контейнере ngcontainer, у которого есть условие relatedItems == true. проблема заключается в том, что пользователь нажимает на game.Related значение меняется на false, но это не отражается в контейнере relatedItems, поэтому данные не переключаются. - game.Realted по умолчанию отображается как true на уровне mainItem и как null relatedItems. Можете ли вы предложить решение этой проблемы, даже сворачивание по индексу не сработало, так как индекс элемента в main не соответствует индексу соответствующего элемента, который нужно переключить, согласно этой ссылке { ссылка }

...