Почему *ngIf срабатывает только у первой строки таблицы ngx-datatable?

Question

Есть таблица ngx-datatable. Создаю колонку с кнопкой:

<ngx-datatable-column
    [width]="50"
    [resizeable]="false"
    [sortable]="false"
    [draggable]="false"
    [canAutoResize]="false"
>
    <ng-template let-row="row" let-rowIndex="rowIndex" ngx-datatable-cell-template>
        <div class="go-to-link">
            <a class="btn " href="{{row.link}}" target="_blank" title="Перейти к источнику"><i class="fas fa-external-link-alt fa"></i></a>
            <button *ngIf="isAddedToProfile(row)==false" class="btn btn-add" (click)="addToProfile(rowIndex)"><i class="far fa-plus-square"></i></button>
            <button *ngIf="isAddedToProfile(row)==true" class="btn btn-delete" (click)="deleteFromProfile(rowIndex)"><i class="fas fa-minus-square"></i></button>
        </div>
    </ng-template>

Хочу чтобы если запись в таблице была сохранена ранее пользователем, то была кнопка "удалить", иначе "Добавить" Передаю "row" в метод для проверки есть ли этот объект в списке добавленных:

isAddedToProfile(row) { 
    let addedAuto = JSON.parse(sessionStorage.getItem('addedAuto'))

    for (let i = 0; i < addedAuto.length; i++) {
      if (row['_id'] == addedAuto[i]['_id']){
        return true
      }
      else {
        return false
      }      
    }                   
}

Пробегаюсь по массиву и ищу совпадения. Я знаю например что 2 элемента ранее добавлены, но в таблице кнопка меняется только у одного.

Answer 1

Ошибка функции в том, что ваш цикл бежит ровно одну итерацию, и если совпадение не найдено вся функция сразу возвращает false. А вам просто надо пойти дальше сравнивать с другими элементами.

isAddedToProfile(row) { 
    // этот массив лучше сразу получить на onInit компонента, записать в поле
    // на onDestroy обновить localStorage
    let addedAuto = JSON.parse(sessionStorage.getItem('addedAuto'))

    for (let i = 0; i < addedAuto.length; i++) {
      if (row['_id'] == addedAuto[i]['_id']){
        return true
      }
    }
    return false;   
}

Или можно короче:

addedPersons = [...];

isAddedToProfile(row) {
    return this.addedPersons.some(person => person.id === row.id);
}

БЛОГ НА HUSL

Почему *ngIf срабатывает только у первой строки таблицы ngx-datatable?

Ответы (1 шт):