QueryList

class

An unmodifiable list of items that Angular keeps up to date when the state of the application changes.

      
      class QueryList<T> {
  dirty: true
  changes: Observable<any>
  length: number
  first: T
  last: T
  map<U>(fn: (item: T, index: number, array: T[]) => U): U[]
  filter(fn: (item: T, index: number, array: T[]) => boolean): T[]
  find(fn: (item: T, index: number, array: T[]) => boolean): T | undefined
  reduce<U>(fn: (prevValue: U, curValue: T, curIndex: number, array: T[]) => U, init: U): U
  forEach(fn: (item: T, index: number, array: T[]) => void): void
  some(fn: (value: T, index: number, array: T[]) => boolean): boolean
  toArray(): T[]
  toString(): string
  reset(res: (any[] | T)[]): void
  notifyOnChanges(): void
  setDirty()
  destroy(): void
}

Description

The type of object that ViewChildren, ContentChildren, and QueryList provide.

Implements an iterable interface, therefore it can be used in both ES6 javascript for (var i of items) loops as well as in Angular templates with *ngFor="let i of myList".

Changes can be observed by subscribing to the changes Observable.

NOTE: In the future this class will implement an Observable interface.

Properties

Property	Description
`dirty: true`	Read-only.
`changes: Observable<any>`	Read-only.
`length: number`	Read-only.
`first: T`	Read-only.
`last: T`	Read-only.

Methods

map()

See Array.map

      
      map<U>(fn: (item: T, index: number, array: T[]) => U): U[]

Parameters

fn (item: T, index: number, array: T[]) => U

Returns

U[]

filter()

See Array.filter

      
      filter(fn: (item: T, index: number, array: T[]) => boolean): T[]

Parameters

fn (item: T, index: number, array: T[]) => boolean

Returns

T[]

find()

See Array.find

      
      find(fn: (item: T, index: number, array: T[]) => boolean): T | undefined

Parameters

fn (item: T, index: number, array: T[]) => boolean

Returns

T | undefined

reduce()

See Array.reduce

      
      reduce<U>(fn: (prevValue: U, curValue: T, curIndex: number, array: T[]) => U, init: U): U

Parameters

`fn`	`(prevValue: U, curValue: T, curIndex: number, array: T[]) => U`
`init`	`U`

Returns

U

forEach()

See Array.forEach

      
      forEach(fn: (item: T, index: number, array: T[]) => void): void

Parameters

fn (item: T, index: number, array: T[]) => void

Returns

void

some()

See Array.some

      
      some(fn: (value: T, index: number, array: T[]) => boolean): boolean

Parameters

fn (value: T, index: number, array: T[]) => boolean

Returns

boolean

toArray()
toArray(): T[] `toArray(): T[]` Parameters There are no parameters. Returns `T[]`

toString()
toString(): string `toString(): string` Parameters There are no parameters. Returns `string`

reset()

      
      reset(res: (any[] | T)[]): void

Parameters

res (any[] | T)[]

Returns

void

notifyOnChanges()
notifyOnChanges(): void `notifyOnChanges(): void` Parameters There are no parameters. Returns `void`

setDirty()
internal
setDirty() `setDirty()` Parameters There are no parameters.

destroy()
internal
destroy(): void `destroy(): void` Parameters There are no parameters. Returns `void`

Usage notes

Example

      
      @Component({...})
class Container {
  @ViewChildren(Item) items:QueryList<Item>;
}