Я хочу, чтобы был виден полный текст заголовка Wijmo FlexGrid:

См. изображение.

Как я могу сделать это с помощью CSS?

1
srashtisj 5 Окт 2016 в 11:12

4 ответа

Лучший ответ

Я также столкнулся с той же проблемой, делая то же самое, вот как я решил это:

Css изменения:

.wjcGrid .wj-colheaders   .wj-header {
    text-overflow: initial;
}

Html изменения:

 <wj-flex-grid  #flex 
    [itemsSource]="data" 
    [isReadOnly]="true" 
    [headersVisibility]="'Column'" 
    [selectionMode]="'Row'" 
    (loadedRows)="onGridLoaded($event)" 
    [autoSizeMode] = "'Headers'">
 </wj-flex-grid>

В компоненте:

  onGridLoaded(){
        var self = this;
        setTimeout(function() {
             self.flex.autoSizeColumns();
        },300);
  }

вы можете удалить setTimeout из вышеуказанного метода, как я использовал, потому что у меня были проблемы с рендерингом, когда я загружал одну и ту же сетку несколько раз.

Надеюсь, это решит вашу проблему.

3
piyush bageria 20 Дек 2016 в 07:46

Я работаю над приложением HTML5 / Angular JS 4 с использованием TypeScript. Мне нужно обернуть заголовок моего столбца. Я просто сделал как показано ниже, и это сработало.

<wj-flex-grid #studentsWjFlexGrid [itemsSource]="studentsPerformanceData" style=" height:100%; width:100%">
    <wj-flex-grid-column binding="longDescription" [width]="100" [wordWrap]="true">
        <ng-template wjFlexGridCellTemplate cellType="ColumnHeader">
            <span style="word-wrap: break-word;">Long Description Goes here</span>
        </ng-template>
    </wj-flex-grid-column>
</wj-flex-grid>
0
Ziggler 9 Мар 2018 в 16:39

Вы должны использовать свойство AutoSize Flexgrid. Проверьте эту тему: http://wijmo.com/topic/auto-adjust- высота-для-flexgrid-столбцов-заголовков /

0
AshishJindal 13 Окт 2016 в 11:43

Вы можете использовать свойство text-overflow и установить для него многоточие

Обратитесь к w3school

0
Sudheer KB 5 Окт 2016 в 08:18