Я изучал угловой в течение последних нескольких недель, и в настоящее время я застрял в проблеме, использующей реактивные формы углового материала.
Когда я запускаю приведенный ниже код, раскрывающийся списокиметь все значения из xS, но выбранное значение отображается как «а», а не «с»
Надеюсь, код, который я разместил, не слишком расплывчатый, мне пришлось удалить некоторыекод, который может быть или не быть чувствительным.
html:
<div fxLayout="row">
<mat-form-field>
<mat-label>Label</mat-label>
<mat-select formControlName="temp" placeholder="Temp" [compareWith]="compareObjects" [(value)]="selectedValue">
<mat-option *ngFor="let x of xS" [value]="x">
{{x}}
</mat-option>
</mat-select>
</mat-form-field>
</div>
Selected: {{ selectedValue }} <!-- Returns 'c' -->
компонент:
...
export class editTempForm implements OnInit {
// xS is: ['a', 'b', 'c', 'd', 'e']
private xS = [];
private selectedValue: string = '';
constructor(private formBuilder: FormBuilder, private apiGet: ApiGet) {
this.populateForm();
this.tempForm = this.createFormGroup();
}
createFormGroup() : FormGroup {
return new FormGroup({
temp: new FormControl(''),
});
}
compareObjects(o1: any, o2: any): boolean {
return o1.name === o2.name && o1._id === o2._id;
}
toArr(arr) {
let rv = [];
for (let i = 0; i < arr.length; i++)
rv[i] = arr[i];
return rv;
}
getDropDownData() {
this.apiGet.getData().subscribe(
(data) => {
if (data) {
this.xS= this.toArr(data);
}
});
populateForm() {
this.getDropDownData();
this.selectedValue = "c";
}
ngOnInit() {
}
}