Skip to content

Commit 94902ac

Browse files
committed
docs(demo): update cascaded select example
fix #2981
1 parent e219267 commit 94902ac

File tree

2 files changed

+22
-10
lines changed

2 files changed

+22
-10
lines changed

demo/src/app/examples/other/cascaded-select/app.component.ts

Lines changed: 21 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { Component } from '@angular/core';
22
import { FormGroup } from '@angular/forms';
33
import { FormlyFieldConfig } from '@ngx-formly/core';
4-
import { distinctUntilChanged, map, startWith, tap } from 'rxjs/operators';
4+
import { distinctUntilChanged, map, startWith } from 'rxjs/operators';
55

66
interface Model {
77
readonly player: string;
@@ -47,12 +47,18 @@ export class AppComponent {
4747
{ id: '3', name: 'Cleveland', sportId: '2' },
4848
{ id: '4', name: 'Miami', sportId: '2' },
4949
];
50-
const sportControl = this.form.get('sport');
50+
const sportControl = field.form.get('sport');
5151
field.templateOptions.options = sportControl.valueChanges.pipe(
52-
distinctUntilChanged(),
53-
tap(() => field.formControl.setValue(null)),
5452
startWith(sportControl.value),
55-
map(sportId => teams.filter(team => team.sportId === sportId)),
53+
distinctUntilChanged(),
54+
map(sportId => {
55+
const options = teams.filter(team => team.sportId === sportId);
56+
if (!options.find(option => sportId === option.id)) {
57+
field.formControl.setValue(null);
58+
}
59+
60+
return options;
61+
}),
5662
);
5763
},
5864
},
@@ -78,12 +84,18 @@ export class AppComponent {
7884
{ id: '7', name: 'Miami (Player 1)', teamId: '4' },
7985
{ id: '8', name: 'Miami (Player 2)', teamId: '4' },
8086
];
81-
const teamControl = this.form.get('team');
87+
const teamControl = field.form.get('team');
8288
field.templateOptions.options = teamControl.valueChanges.pipe(
83-
distinctUntilChanged(),
84-
tap(() => field.formControl.setValue(null)),
8589
startWith(teamControl.value),
86-
map(teamId => players.filter(player => player.teamId === teamId)),
90+
distinctUntilChanged(),
91+
map(teamId => {
92+
const options = players.filter(team => team.teamId === teamId);
93+
if (!options.find(option => teamId === option.id)) {
94+
field.formControl.setValue(null);
95+
}
96+
97+
return options;
98+
}),
8799
);
88100
},
89101
},

src/core/src/lib/extensions/field-expression/field-expression.spec.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { TestBed, inject} from '@angular/core/testing';
1+
import { TestBed, inject } from '@angular/core/testing';
22
import { FormGroup, Validators, FormControl } from '@angular/forms';
33
import { Component } from '@angular/core';
44
import { Subject, of, BehaviorSubject } from 'rxjs';

0 commit comments

Comments
 (0)