选项列表不适用于Observables

时间:2019-07-06 17:36:12

标签: html typescript angular7

我有一个类别选项列表,可以选择一本书的类别。当我尝试使用可观察项时,选项列表为空,但是如果我尝试使用数组,则它可以正常工作而没有任何问题。为什么会这样。可观察项不适用于选项列表。

以下代码无法正常运行!

 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>

0 个答案:

没有答案