New to Kendo UI for Angular? Start a free 30-day trial
toDataSourceRequestString
Updated on Jan 16, 2026
Converts a DataSourceRequestState into a string
that is comparable with the DataSourceRequest format in UI for ASP.NET MVC.
Parameters
state
The state that will be serialized.
Returns
string
The serialized state.
The following code snippet demonstrates how to use the toDataSourceRequestString method.
ts
import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';
import {
DataSourceRequestState,
toDataSourceRequestString,
translateDataSourceResultGroups,
translateAggregateResults
} from '@progress/kendo-data-query';
export class ProductService {
private BASE_URL = 'https://api.example.com/products';
constructor(private http: HttpClient) { }
public fetch(state: DataSourceRequestState): Observable<GridDataResult> {
// DataSourceRequestState includes:
// - State properties: skip, take, sort, filter, group
// - Additional property: aggregates
const queryString = toDataSourceRequestString(state);
const hasGroups = state.group && state.group.length;
return this.http
.get<ServerResponse>(`${this.BASE_URL}?${queryString}`)
.pipe(
map(({ Data, Total, AggregateResults }) => ({
data: hasGroups ? translateDataSourceResultGroups(Data) : Data,
total: Total,
aggregateResult: translateAggregateResults(AggregateResults)
}))
);
}
}