Добавить новую пустую строку в начале в сетке Wijmo Angular2

Question

Я пытаюсь добавить новую пустую строку в начале сетки при нажатии внешней кнопки. Сетка показывает отлично.

<wj-flex-grid #flex 
    [itemsSource]="data" 
    [isReadOnly]="true" 
    [headersVisibility]="'Column'" 
    [selectionMode]="'ListBox'" 
    (selectionChanged)="gridSelectionChange($event, flex)" 
    (loadedRows)="onGridLoaded($event)">
</wj-flex-grid>

и использование данных collectionView:

this.data = new wjcCore.CollectionView(records);

С помощью [allowAddNew] = 'true', Он добавляет новую строку в нижней части по умолчанию. Но я хочу добавить в начале по нажатию кнопки.

Обновлено:

addNewRow(ctl) {
    this.data.addNew();
}

где addNewRow работает нормально, но добавляя снизу:

<a (click)="addNewRow(flex)">add new</a>

Пожалуйста, помогите, как я могу этого добиться.

Спасибо

Answer 1

Чтобы установить новую строку сверху, сетка wijmo предоставляет свойство newRowAtTop,

Измените ваш код, как показано ниже:

<wj-flex-grid #flex 
    [newRowAtTop] = "true"
    [itemsSource]="data" 
    [isReadOnly]="true" 
    [headersVisibility]="'Column'" 
    [selectionMode]="'ListBox'" 
    (selectionChanged)="gridSelectionChange($event, flex)" 
    (loadedRows)="onGridLoaded($event)">
</wj-flex-grid>

Обратите внимание [newRowAtTop] = "true" часть в приведенном выше коде.

Следующее описание newRowAtTop скопировано с этой ссылки:

Получает или задает значение, указывающее, должен ли новый шаблон строки располагаться вверху сетки или внизу.

Если вы установили для свойства newRowAtTop значение true и хотите, чтобы новый шаблон строки всегда оставался видимым, присвойте свойству frozenRows значение один. Это замораживает новый шаблон строки в верхней части, поэтому он не прокручивается от вида.

Новый шаблон строки будет отображаться только в том случае, если для свойства allowAddNew установлено значение true и если объект itemsSource поддерживает добавление новых элементов.