Динамическое добавление / удаление столбцов дает мне горизонтальную полосу прокрутки

Question

При работе с JqxGrid в угловом формате я создавал флажок, который включал бы появление дополнительных столбцов.Я думал, что это будет довольно просто, когда предполагается, что Grid занимает все доступное пространство.

Проблема, которую я заметил, заключается в том, что при переключении состояния для добавления новых строк появляется полоса прокрутки.

Моя кодовая база выглядит следующим образом:

///Globals: 
//    dataColumns: []
//    dataAdapter: []
//    isToggled : boolean
//    dataFields: []

toggleFired(e){
    this.isToggled = e.target.checked;
    this.setColumns(this.columns);
    this.setDataAdapter();
}
setColumns(columns){
    let dColumns = []
    let dataFields = []
    if (this.isToggled){
        //The reason i clone columns is to not augment the original column array.  If i removed this, subsequent taps will mention datafield reuse errors.
        columns = columns.slice;
        let iconColumn = new DataColumn();
        iconColumn.width = "20px";
        /// other properties set.
        columns.unshift(iconColumn);
    }
    for( let col of columns){
      let dColumn = {
        width: col.width,
        text: col.text || "",
        cellsrenderer: null,
        cellClassName: "col",
        dataField: col.datafield
      };
      if (!dColumn.width) delete dColumn.width;
      dColumns.push(dColumn);
    }
    this.dataFields = dataFields;
    this.dataColumns = dColumns;
}
setDataAdapter(){
    //This aspect is primarily used for the data rows.  It sets localdata, datatype, and datafields. 
    //After creating that object, it will update the dataAdapter Obj passed into jqxGrid.
}

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

Примечание. Некоторые столбцы могут иметь некоторую ширину, но есть некоторые, которых нет, и которые должны занимать столько же места, скольковозможно.

Примечание. В этой демонстрации ни один столбец не имеет определенной ширины, за исключением этой новой инъекции, которая имеет ширину «20 пикселей»

Я думал, что при сбросестолбцы данных, он будет перерисовывать столбцы с неопределенным с, чтобы соответствовать как можно больше.

Я искал другие функции внутри jqxGrid, но ни одна не выскакивала на меня, и API не дал подробностей о функциях,просто список функций, свойств и т. д.

Разметка:

<jqxGrid [source]="dataAdapter" [columns]="dataColumns" 
         [columnsresize]="true" 
         width="100%" height="100%"></jqxGrid>

Для справки: https://www.jqwidgets.com/angular-components-documentation/documentation/jqxgrid/angular-grid-api.htm?search=grid

Редактировать : я заметил, чтокогда я изменяю размер окна или сплиттера, сетка автоматически подстраивается.Это означает, что событие слушается.Я пытался смоделировать это с подобными событиями: $(window).trigger("resize") например, но безрезультатно.Где-то может быть базовая функция, которую я могу использовать.

На данный момент я попытался сделать следующее: - this.grid.render () - this.grid.resize () - $ (this.hostRef)) .trigger ("resize") - $ (this.grid) .trigger ("resize") - $ (this.grid.host) .trigger ("resize") - $ (window) .trigger ("resize")

все равно ничего.