PrimeNG - принудительная сортировка для новой строки p-dataTable inline

Я пытаюсь создать код, позволяющий конечному пользователю щелкнуть кнопку «Добавить новую строку», и пустая строка появится в строке как первая строка p-datatable. В настоящее время, когда я добавляю новый элемент в массив за кулисами, эта строка появляется в, казалось бы, случайном месте в таблице.

Я думаю, что решение должно включать в себя возможность сортировки по скрытому столбцу за кулисами, независимо от того, какой выбранный пользователем порядок сортировки находится в таблице. Например, пользователь в настоящее время выполняет сортировку по столбцу «Фамилия» по возрастанию, поэтому я упорядочиваю сначала по убыванию невидимого столбца «Сортировщик», а затем по возрастанию по фамилии. Каждая запись в таблице будет иметь значение 0 для сортировщика, за исключением вновь добавленной строки, которой присвоено значение 1.

Как тогда мне переопределить сортировку для p-datatable, чтобы мои новые строки всегда отображались в верхней части таблицы, независимо от того, как конечный пользователь отсортировал таблицу с помощью графического интерфейса? Прямо сейчас, когда пользователь щелкает столбец для сортировки, он удаляет мою скрытую сортировку.

Спасибо!


angular primeng primeng-datatable
person twosouth    schedule 17.11.2017    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Сначала вы можете создать фиктивную строку (я создаю ее динамически, потому что я получаю имя столбцов с сервера). Согласно документации primeng, при добавлении / удалении строк вы всегда должны создавать новую ссылку на массив вместо того, чтобы манипулировать существующим массивом, поскольку Angular не запускает сеттеры, если ссылка не изменяется. Новые строки будут отображаться вверху, пока пользователь не щелкнет заголовок столбца для сортировки строк.

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

buildNewRowDummy(): string[] {
    const newRowDummy = [];
    for (let col = 0; col < this.cols.length; col++) {
      const columnName = this.cols[col];
      newRowDummy[columnName] = '';
    }

    return newRowDummy;
  }

addRow() {
  this.rows = [ this.buildNewRowDummy(), ...this.rows ];
}
person Nikita Marinosyan    schedule 27.11.2017