Hi,
I have implemented kendo grid using angular. In the same I have virtual scrolling implemented. I want auto fix columns width as per row data. i.e. if any column have data like "testing data for width- should be in one row." it should place in one row. right now it is showing the data into the two lines. for auto fix width - I have added following code
on html page
<kendo-grid #dataTable [data]="query | async" (dataStateChange)="dataStateChange($event)" [resizable]="true" [autoSize]="true">
</kendo-grid>
on component.ts
export class ListComponent extends AppComponentBase implements OnInit, AfterViewInit {
@ViewChild(GridComponent) public grid: GridComponent | undefined;
public constructor( private ngZone: NgZone ) {
super(injector);
}
public ngAfterViewInit(): void {
this.fitColumns();
}
public dataStateChange(state: State): void {
this.fitColumns();
}
private fitColumns(): void {
this.ngZone.onStable.asObservable().pipe(take(1)).subscribe(() => {
this.grid.autoFitColumns();
});
}
}
above code set width as per column's name. I required autofix column width on both column name as well as on row data.
Thanks.