DevExtreme Angular - Query Methods

This section describes methods that perform operations on data associated with the Query.

aggregate(seed, step, finalize)

Calculates a custom summary for all data items.

Parameters:
seed:

Object

The initial value.

step:

Function

A function called for each item.

finalize:

Function

A function that is called after the calculation is finished.

Return Value:

Promise<any> (jQuery or native)

A Promise that is resolved after the operation is completed. It is a native Promise or a jQuery.Promise when you use jQuery.

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • let step = (total, itemData) => {
  • // "total" is an accumulator value that should be changed on each iteration
  • // "itemData" is the item to which the function is being applied
  • return total + itemData;
  • };
  •  
  • let finalize = total => {
  • // "total" is the resulting accumulator value
  • return total / 1000;
  • };
  •  
  • Query([10, 20, 30, 40, 50])
  • .aggregate(0, step, finalize)
  • .then(result => {
  • console.log(result); // outputs 0.15
  • });
  • };
  • }

aggregate(step)

Calculates a custom summary for all data items.

Parameters:
step:

Function

A function that is called for each item.

Return Value:

Promise<any> (jQuery or native)

A Promise that is resolved after the operation is completed. It is a native Promise or a jQuery.Promise when you use jQuery.

This is a shortcut for the aggregate(seed, step, finalize) method. It omits the seed and finalize parameters: instead of the seed value, the accumulator value is initialized with the first item's value; the finalize parameter's omission means that the calculation result is the accumulator value after the last step function's execution.

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • let step = (total, itemData) => {
  • // "total" is an accumulator value that should be changed on each iteration
  • // "itemData" is the item to which the function is being applied
  • return total + itemData;
  • };
  •  
  • Query([10, 20, 30, 40, 50])
  • .aggregate(step)
  • .then(result => {
  • console.log(result); // outputs 150
  • });
  • };
  • }

avg()

Calculates the average of all values. Applies only to numeric arrays.

Return Value:

Promise<Number> (jQuery or native)

A Promise that is resolved after the operation is completed. It is a native Promise or a jQuery.Promise when you use jQuery.

First, call the select(getter) method to select the object field that provides numeric values if the Query is associated with an array of objects, or use the avg(getter) method instead of avg().

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • let dataObjects = [ ... ];
  •  
  • Query(dataObjects)
  • .select("price")
  • .avg()
  • .then(result => {
  • // "result" contains the calculated value
  • });
  • };
  • }

avg(getter)

Calculates the average of all values found using a getter.

Parameters:
getter:

Object

A getter; in most cases, the name of the field that provides values for the calculation.

Return Value:

Promise<Number> (jQuery or native)

A Promise that is resolved after the operation is completed. It is a native Promise or a jQuery.Promise when you use jQuery.

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • let dataObjects = [ ... ];
  •  
  • Query(dataObjects)
  • .avg("price")
  • .then(result => {
  • // "result" contains the calculated value
  • });
  • };
  • }

If the Query is associated with a numeric array, use the avg() method instead.

count()

Calculates the number of data items.

Return Value:

Promise<Number> (jQuery or native)

A Promise that is resolved after the operation is completed. It is a native Promise or a jQuery.Promise when you use jQuery.

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • Query([10, 20, 30, 40, 50])
  • .count()
  • .then(result => {
  • console.log(result); // outputs 5
  • });
  • };
  • }

enumerate()

Executes the Query. This is an asynchronous alternative to the toArray() method.

Return Value:

Promise<any> (jQuery or native)

A Promise that is resolved after the operation is completed. It is a native Promise or a jQuery.Promise when you use jQuery.

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • Query("http://mydomain.com/MyDataService", queryOptions)
  • .enumerate()
  • .then(result => {
  • // "result" contains the obtained array
  • });
  • };
  • }

filter(criteria)

Filters data items using a filter expression.

Parameters:
criteria:

Array<any>

A filter expression; described in the Filtering section.

Return Value:

Query

The Query with transformed data.

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • let dataObjects = [ ... ];
  •  
  • let filteredData = Query(dataObjects)
  • .filter(["price", "<", 500])
  • // or
  • // .filter("price", "<", 500)
  • .toArray();
  • };
  • }

filter(predicate)

Filters data items using a custom function.

Parameters:
predicate:

Function

A function that accepts a data item and returns true if it should be included in the resulting array and false otherwise.

Return Value:

Query

The Query with transformed data.

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • let filteredData = Query([10, 20, 40, 50, 30])
  • .filter(dataItem => dataItem < 25)
  • .toArray();
  •  
  • console.log(filteredData); // outputs [10, 20]
  • };
  • }
See Also

groupBy(getter)

Groups data items by the specified getter.

Parameters:
getter:

Object

A getter; in most cases, the name of the data field to group by.

Return Value:

Query

The Query with transformed data.

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • let dataObjects = [
  • { name: "Amelia", birthYear: 1991, gender: "female" },
  • { name: "Benjamin", birthYear: 1983, gender: "male" },
  • { name: "Daniela", birthYear: 1987, gender: "female" },
  • { name: "Lee", birthYear: 1981, gender: "male" }
  • ];
  •  
  • let groupedData = Query(dataObjects)
  • .groupBy("gender")
  • .toArray();
  •  
  • console.log(groupedData);
  • /* outputs
  • [{
  • key: "female",
  • items: [
  • { name: "Amelia", birthYear: 1991, gender: "female" },
  • { name: "Daniela", birthYear: 1987, gender: "female" }
  • ]
  • }, {
  • key: "male",
  • items: [
  • { name: "Benjamin", birthYear: 1983, gender: "male" },
  • { name: "Lee", birthYear: 1981, gender: "male" }
  • ]
  • }] */
  • };
  • }
See Also

max()

Calculates the maximum value. Applies only to numeric arrays.

Return Value:

Promise<Number | Date> (jQuery or native)

A Promise that is resolved after the operation is completed. It is a native Promise or a jQuery.Promise when you use jQuery.

First, call the select(getter) method to select the object field that provides numeric values if the Query is associated with an array of objects, or use the max(getter) method instead of max().

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • let dataObjects = [ ... ];
  •  
  • Query(dataObjects)
  • .select("price")
  • .max()
  • .then(result => {
  • // "result" contains the calculated value
  • });
  • };
  • }

max(getter)

Calculates the maximum of all values found using a getter.

Parameters:
getter:

Object

A getter; in most cases, the name of the field that provides values for the calculation.

Return Value:

Promise<Number | Date> (jQuery or native)

A Promise that is resolved after the operation is completed. It is a native Promise or a jQuery.Promise when you use jQuery.

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • let dataObjects = [ ... ];
  •  
  • Query(dataObjects)
  • .max("price")
  • .then(result => {
  • // "result" contains the calculated value
  • });
  • };
  • }

If the Query is associated with a numeric array, use the max() method instead.

min()

Calculates the minimum value. Applies only to numeric arrays.

Return Value:

Promise<Number | Date> (jQuery or native)

A Promise that is resolved after the operation is completed. It is a native Promise or a jQuery.Promise when you use jQuery.

First, call the select(getter) method to select the object field that provides numeric values if the Query is associated with an array of objects, or use the min(getter) method instead of min().

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • let dataObjects = [ ... ];
  •  
  • Query(dataObjects)
  • .select("price")
  • .min()
  • .then(result => {
  • // "result" contains the calculated value
  • });
  • };
  • }

min(getter)

Calculates the minumum of all values found using a getter.

Parameters:
getter:

Object

A getter; in most cases, the name of the field that provides values for the calculation.

Return Value:

Promise<Number | Date> (jQuery or native)

A Promise that is resolved after the operation is completed. It is a native Promise or a jQuery.Promise when you use jQuery.

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • let dataObjects = [ ... ];
  •  
  • Query(dataObjects)
  • .min("price")
  • .then(result => {
  • // "result" contains the calculated value
  • });
  • };
  • }

If the Query is associated with a numeric array, use the min() method instead.

select(getter)

Selects individual fields from data objects.

Parameters:
getter:

Object

|

Array<getter>

A getter; in most cases, the names of the data fields to select.

Return Value:

Query

The Query with transformed data.

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • let dataObjects = [
  • { name: "Amelia", birthYear: 1991, gender: "female" },
  • { name: "Benjamin", birthYear: 1983, gender: "male" },
  • { name: "Daniela", birthYear: 1987, gender: "female" },
  • { name: "Lee", birthYear: 1981, gender: "male" }
  • ];
  •  
  • let selectedData = Query(dataObjects)
  • .select("birthYear", "name")
  • .toArray();
  •  
  • console.log(selectedData);
  • /* outputs
  • [
  • { birthYear: 1991, name: "Amelia" },
  • { birthYear: 1983, name: "Benjamin" },
  • { birthYear: 1987, name: "Daniela" },
  • { birthYear: 1981, name: "Lee" }
  • ] */
  • };
  • }

slice(skip, take)

Gets a specified number of data items starting from a given index.

Parameters:
skip:

Number

The index of the first data item to get.

take:

Number

| undefined

Optional. The number of data items to get.

Return Value:

Query

The Query with transformed data.

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • let dataObjects = [
  • { name: "Amelia", birthYear: 1991, gender: "female" },
  • { name: "Benjamin", birthYear: 1983, gender: "male" },
  • { name: "Daniela", birthYear: 1987, gender: "female" },
  • { name: "Lee", birthYear: 1981, gender: "male" }
  • ];
  •  
  • let subset = Query(dataObjects)
  • .slice(1, 2)
  • .toArray();
  •  
  • console.log(subset);
  • /* outputs
  • [
  • { name: "Benjamin", birthYear: 1983, gender: "male" },
  • { name: "Daniela", birthYear: 1987, gender: "female" }
  • ] */
  • };
  • }

sortBy(getter)

Sorts data items by the specified getter in ascending order.

Parameters:
getter:

Object

A getter; in most cases, the name of the data field to sort by.

Return Value:

Query

The Query with transformed data.

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • let dataObjects = [
  • { name: "Amelia", birthYear: 1991, gender: "female" },
  • { name: "Benjamin", birthYear: 1983, gender: "male" },
  • { name: "Daniela", birthYear: 1987, gender: "female" },
  • { name: "Lee", birthYear: 1981, gender: "male" }
  • ];
  •  
  • let sortedData = Query(dataObjects)
  • .sortBy("birthYear")
  • .toArray();
  •  
  • console.log(sortedData);
  • /* outputs
  • [
  • { name: "Lee", birthYear: 1981, gender: "male" },
  • { name: "Benjamin", birthYear: 1983, gender: "male" },
  • { name: "Daniela", birthYear: 1987, gender: "female" },
  • { name: "Amelia", birthYear: 1991, gender: "female" }
  • ] */
  • };
  • }

To sort data items by one more getter, call the thenBy(getter) or thenBy(getter, desc) method after sortBy.

See Also

sortBy(getter, desc)

Sorts data items by the specified getter in the specified sorting order.

Parameters:
getter:

Object

A getter; in most cases, the name of the data field to sort by.

desc:

Boolean

Pass true to sort in descending order, false or nothing to sort in ascending order.

Return Value:

Query

The Query with transformed data.

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • let dataObjects = [
  • { name: "Amelia", birthYear: 1991, gender: "female" },
  • { name: "Benjamin", birthYear: 1983, gender: "male" },
  • { name: "Daniela", birthYear: 1987, gender: "female" },
  • { name: "Lee", birthYear: 1981, gender: "male" }
  • ];
  •  
  • let sortedData = Query(dataObjects)
  • .sortBy("birthYear", true)
  • .toArray();
  •  
  • console.log(sortedData);
  • /* outputs
  • [
  • { name: "Amelia", birthYear: 1991, gender: "female" },
  • { name: "Daniela", birthYear: 1987, gender: "female" },
  • { name: "Benjamin", birthYear: 1983, gender: "male" },
  • { name: "Lee", birthYear: 1981, gender: "male" }
  • ] */
  • };
  • }

Call the thenBy(getter) or thenBy(getter, desc) method after sortBy to sort data items by one more getter.

See Also

sum()

Calculates the sum of all values.

Return Value:

Promise<Number> (jQuery or native)

A Promise that is resolved after the operation is completed. It is a native Promise or a jQuery.Promise when you use jQuery.

First, call the select(getter) method to select the object field that provides numeric values if the Query is associated with an array of objects, or use the sum(getter) method instead of sum().

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • let dataObjects = [ ... ];
  •  
  • Query(dataObjects)
  • .select("price")
  • .sum()
  • .then(result => {
  • // "result" contains the calculated value
  • });
  • };
  • }

sum(getter)

Calculates the sum of all values found using a getter.

Parameters:
getter:

Object

A getter; in most cases, the name of the field that provides values for the calculation.

Return Value:

Promise<Number> (jQuery or native)

A Promise that is resolved after the operation is completed. It is a native Promise or a jQuery.Promise when you use jQuery.

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • let dataObjects = [ ... ];
  •  
  • Query(dataObjects)
  • .sum("price")
  • .then(result => {
  • // "result" contains the calculated value
  • });
  • };
  • }

If the Query is associated with a numeric array, use the sum() method instead.

thenBy(getter)

Sorts data items by one more getter in ascending order.

Parameters:
getter:

Object

A getter; in most cases, the name of the data field to sort by.

Return Value:

Query

The Query with transformed data.

This method can only follow the sortBy(getter), sortBy(getter, desc), thenBy(getter, desc), or another thenBy(getter) method call.

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • let dataObjects = [
  • { name: "Amelia", birthYear: 1991, gender: "female" },
  • { name: "Benjamin", birthYear: 1983, gender: "male" },
  • { name: "Daniela", birthYear: 1987, gender: "female" },
  • { name: "Lee", birthYear: 1981, gender: "male" }
  • ];
  •  
  • let sortedData = Query(dataObjects)
  • .sortBy("gender")
  • .thenBy("birthYear")
  • .toArray();
  •  
  • console.log(sortedData);
  • /* outputs
  • [
  • { name: "Daniela", birthYear: 1987, gender: "female" },
  • { name: "Amelia", birthYear: 1991, gender: "female" },
  • { name: "Lee", birthYear: 1981, gender: "male" },
  • { name: "Benjamin", birthYear: 1983, gender: "male" }
  • ] */
  • };
  • }
See Also

thenBy(getter, desc)

Sorts data items by one more getter in the specified sorting order.

Parameters:
getter:

Object

A getter; in most cases, the name of the data field to sort by.

desc:

Boolean

Pass true to sort in descending order, false or nothing to sort in ascending order.

Return Value:

Query

The Query with transformed data.

This method can only follow the sortBy(getter), sortBy(getter, desc), thenBy(getter), or another thenBy(getter, desc) method call.

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • let dataObjects = [
  • { name: "Amelia", birthYear: 1991, gender: "female" },
  • { name: "Benjamin", birthYear: 1983, gender: "male" },
  • { name: "Daniela", birthYear: 1987, gender: "female" },
  • { name: "Lee", birthYear: 1981, gender: "male" }
  • ];
  •  
  • let sortedData = Query(dataObjects)
  • .sortBy("gender")
  • .thenBy("birthYear", true)
  • .toArray();
  •  
  • console.log(sortedData);
  • /* outputs
  • [
  • { name: "Amelia", birthYear: 1991, gender: "female" },
  • { name: "Daniela", birthYear: 1987, gender: "female" },
  • { name: "Benjamin", birthYear: 1983, gender: "male" },
  • { name: "Lee", birthYear: 1981, gender: "male" }
  • ] */
  • };
  • }
See Also

toArray()

Gets data items associated with the Query. This is a synchronous alternative to the enumerate() method.

Return Value:

Array<any>

The data items.

TypeScript
  • import Query from "devextreme/data/query";
  • // ...
  • export class AppComponent {
  • constructor () {
  • let data = Query([10, 20, 50, 40, 30])
  • .sortBy()
  • .toArray();
  •  
  • console.log(data); // outputs [10, 20, 30, 40, 50]
  • };
  • }