我有一个类别选项列表,可以选择一本书的类别。当我尝试使用可观察项时,选项列表为空,但是如果我尝试使用数组,则它可以正常工作而没有任何问题。为什么会这样。可观察项不适用于选项列表。
以下代码无法正常运行!
category$: Observable<categoryModel[]>;
<div class="form-group">
<label for="option-role">Category:</label>
<select class="form-control form-control-sm" id="options" formControlName="category" required
[ngClass]="{'is-invalid':submitted && f.category.errors}">
<option value="" disabled>select</option>
<option *ngFor="let category of category$ | async" [ngValue]="category ">{{category ?.name}}</option>
</select>
<div *ngIf="submitted && f.category.errors" class="invalid-feedback">
<div *ngIf="f.category.errors.required">Please select atleast one Category</div>
</div>
</div>
但是如果我尝试使用简单的数组Array进行相同的代码,则可以正常工作。下面的代码可以正常工作
category$:Observable<categoryModel[]>;
this.category$.subscribe(category=>{
this.categoryArray=category;});
<div class="form-group">
<label for="option-role">Category:</label>
<select class="form-control form-control-sm" id="options" formControlName="category" required
[ngClass]="{'is-invalid':submitted && f.category.errors}">
<option value="" disabled>select</option>
<option *ngFor="let category of categoryArray" [ngValue]="category ">{{category ?.name}}</option>
</select>
<div *ngIf="submitted && f.category.errors" class="invalid-feedback">
<div *ngIf="f.category.errors.required">Please select atleast one Category</div>
</div>
</div>