PrimeNG убирает выделение строки из таблицы в одиночном выделении - PullRequest
Новая
       22

PrimeNG убирает выделение строки из таблицы в одиночном выделении

0 голосов
/ 19 октября 2018

Я пытался использовать Table - CRUD от PRIMENG, но у меня та же проблема, что и в примере.Выбор продолжается, даже когда я закрываю диалог.Я хочу очистить этот выбор после закрытия диалога.Я пытался даже с @ViewChild ссылки из класса Table. 

@ViewChild('dtUserEmp') table: Table;

TagID 

<p-table #dtUserEmp selectionMode="single"
       [(selection)]="usuarioEmpresaSelection"
       (onLazyLoad)="lazyLoadingNat($event)"
       (onRowSelect)="rowSelect($event)"
       (onRowUnselect)="rowUnselect($event)"
       dataKey="empresa"...>... </p-table>

Ссылка из документации, что я следую: https://www.primefaces.org/primeng/#/table/crud

1 Ответ

0 голосов
/ 21 октября 2018

Это не лучший способ сделать это, но я могу рассказать вам, как вы можете достичь этого.Позже вы можете сделать это лучше.Вы также видите некоторые ошибки в консоли, но вы можете легко их обработать, и это не сломает ваше приложение.Итак, давайте разберем ваше требование, как показано ниже:

Теперь, когда вы щелкаете по любому классу строк, добавляется ui-state-highlight .Поэтому ключом является удаление этого класса всякий раз, когда мы нажимаем на кнопку сохранения.

Предположим, ниже приведена моя таблица, и я дал #dd в качестве ссылки на эту таблицу. 

<p-table #dd [columns]="cols" [value]="cars" 
  selectionMode="multiple" 
  [(selection)]="selectedCars2" 
  [metaKeySelection]="true">
...
</p-table>

Теперь всякий раз, когда вы вызываетенажмите кнопку сохранения, просто передайте dd внутри него, или вы можете использовать dd в качестве @ViewChild в своем компоненте. 

<button (click)="save(dd)">Save</button>
or
import { Table } from '../../../../node_modules/primeng/components/table/table';
export class TableComponent{
 @ViewChild('dd') dd: Table;
 save(){
 }

}

сейчасв файле компонента внутри функции сохранения выполните следующее: Здесь вы найдете всю строку e.tableViewChild.nativeElement.children [2] .children 

save(e:any){
    let element = e.tableViewChild.nativeElement.children[2].children;
    for(let key in element){
        (element[key].classList).remove('ui-state-highlight');
    }
  }

Это удалиткласс из строки в табл.Вы можете напечатать значение и попытаться получить значение динамически для детей [2].Который я жестко запрограммировал на 2. Вам нужно искать tbody .Я надеюсь, что эта позиция зафиксирована за столом.Так что закодированный будет работать везде.Хотя вы можете сделать его динамичным.

...