Loop through @ViewChildren native elements

Question

Given the following markup

<div *ngFor="let item of items">
    <input type="text" #val />
</div>

I defined in a component

@ViewChildren('val') rows;

And I disable the first input element with

this.rows.first.nativeElement.disabled = true;

How can I loop to disable all the inputs?

This doesn't work

this.rows.forEach(val => val.disabled = true);

and this doesn't work either

this.rows.forEach(val => val.nativeElement.disabled = true);

Answer 1

To loop through the children, use toArray() like so:

this.rows.toArray().forEach(val => val.nativeElement.disabled = true);