Clarity Datagrid - попытка установить выделение с использованием клонированного объекта не работает

При использовании сетки данных с режимом одиночного выбора после визуализации сетки данных - если мы попытаемся установить значение для текущего выбора, обновив переменную, которая привязана к [(clrDgSingleSelected)], соответствующий переключатель не будет «проверен», даже если устанавливаемый объект равен по значению одному из элементов таблицы данных. Выбор работает только в том случае, если объект равен по ссылке одному из элементов в сетке данных.

Аналогичное поведение наблюдается для обоих вариантов выбора при использовании [(clrDgSelected)].

Шаги по воспроизведению поведения:

  1. Возьмем пример документации для ясности в сетке данных, которая отображает список пользователей и использует trackById.
  2. В конструкторе компонента попробуйте установить значение для одиночного выбора, но используйте клонированный объект.
    setTimeout(() => {
      this.selectedUser = {...this.users[2]}; 
    }, 4000);

В реальной жизни - никто не клонирует объект на национальном уровне - но у него уже есть объект, который нужно установить как выделение, и сетка данных только что была визуализирована с новыми данными с сервера, и все они являются вновь созданными объектами. Один из объектов в сетке данных соответствует объекту, который должен быть выбран по значению, но не по ссылке.

Stackblitz (проблема с одним выбором): https://stackblitz.com/edit/clarity-v2-dg-selection

Stackblitz (проблема с множественным выбором): https://stackblitz.com/edit/clarity-v2-dg-selection-multiple

Я обнаружил ошибку в Clarity (https://github.com/vmware/clarity/issues/4250), но упоминается, что это проблема использования.

Я надеюсь, что кто-то из команды Clarity пересмотрит этот сценарий и предложит обходной путь / исправление.


angular clarity
person Wand Maker    schedule 05.02.2020    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Я столкнулся с аналогичной проблемой в нашем коде, так как сетка данных ясности сравнивает по ссылке. Я использую следующий подход для идентификации выбранных объектов из списка:

import {   
  intersectionBy as _intersectionBy, 
  differenceBy as _differenceBy, 
  uniqBy as _uniqBy } 
from 'lodash';    

private renewSelectedItems<EntityType>(datagridItemList: EntityType[], selected: EntityType[], matchProperty = 'id') {
    const currentGridSelected = _intersectionBy(datagridItemList, selectedItems, matchProperty);
    const selectedItemsNotInDatagridItemList = _differenceBy(selectedItems, datagridItems, matchProperty);
    const selectedObjects = _uniqBy([...currentGridSelected, ...selectedItemsNotInDatagridItemList], matchProperty);

    return selectedObjects;
}

Я вызываю этот renewSelectedItems метод всякий раз, когда мы обновляем данные сетки или изменяем выбор.

this.selected = this.renewSelectedItems(this.allItems, this.selected, 'id');

Надеюсь, это поможет.

person Ashish Patel    schedule 05.02.2020