Issue
I have a dynamic array of ng-select controls. Each control represented by class NgSelectComponent.
When select value changes I want to subscribe to all controls.
Template
<ng-select #select">
<ng-option *ngFor="let option of options" [value]="select.id">{{ option.name }}</ng-option>
</ng-select>
Class
@ViewChildren('select') controls: QueryList<NgSelectComponent>;
ngAfterViewInit() {
concat(this.controls.toArray()).subscribe(x => {
console.log(x);
});
}
I try that, but does not work.
concat(this.components.toArray()).subscribe(x => {
console.log(x);
});
I believe it does not work because I had to subscribe to the values produced by each control corresponded by changeEvent but struggling to do that.
Any ideas how to solve?
Solution
First of all, concat
will likely not work. With concat
, each observable in the array will wait for the previous to complete. This is probably not the behaviour you are expecting here.
You may use merge
which will simply forwards all the emitted values to the output Observable individually. Or use combineLatest
if you want an array of all the current values, whenever one Observable emits.
To convert the valueChanges
of the controls
to an array, use a map
.
merge(
...this.controls.toArray().map(c => c.changeEvent.asObservable())
).subscribe(x => {
console.log(x);
});
Answered By - Tobias S.
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.