Angular 5 DevExtreme DataGrid Виджет Настройка столбцов - PullRequest
Новая
       26

Angular 5 DevExtreme DataGrid Виджет Настройка столбцов

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

Я борюсь с заголовком моих столбцов. У меня есть объект конфигурации, в котором определено отображаемое имя, но я не могу изменить заголовок своих столбцов. 

<div class="grid">
<dx-data-grid 
    #dataGrid 
    [columnAutoWidth]="true" 
    [dataSource]='machinery' 
    (onContentReady)='onContentReady($event)'
    (onToolbarPreparing)="onToolbarPreparing($event)" 
    [showBorders]="true" 
    (onRowClick)='rowClick($event)'
    (onEditorPreparing)='onEditorPreparing($event)' 
    [customizeColumns]='customizeColumns'> 
    <dxo-remote-operations 
        sorting="true" 
        paging="true" 
        filtering="true">
    </dxo-remote-operations>
    <dxo-paging [pageSize]="50"></dxo-paging>
    <dxo-scrolling mode="virtual" rowRenderingMode="virtual">
    </dxo-scrolling>
    <dxo-selection mode="single"></dxo-selection>
    <dxo-filter-row visible="true" applyFilter="auto">
    </dxo-filter-row>
    <dxi-column dataField="Company"></dxi-column>
    <dxi-column dataField="Sourcesystem"></dxi-column>
    <dxi-column dataField="Description"></dxi-column>
</dx-data-grid>

Мой код TS 

@ViewChild('dataGrid')
_dataGrid: DxDataGridComponent;

ngAfterViewInit() {
    this._dataGrid.columns.forEach(col => {
        console.log('col', col);
        col.caption = 'dd';
    });
    console.log('this._dataGrid.columns', this._dataGrid.columns);
}

В моем примере я вижу изменения в консоли, но мои подписи все еще имеют стандартное значение.

Что я делаю не так, или есть другие решения для изменения заголовка столбцов.

1 Ответ

0 голосов
/ 06 марта 2019

просто задайте свойство заголовка для dxi-столбца, как показано ниже:

dxi-column alignment = "left" [allowFiltering] = "false" dataField = "budgetUsed" caption = "Используемый бюджет" [allowEditing] = "false" [minWidth] = "400" cellTemplate = "barTemplate">

...