Javascript 无法使用firebase数据填充下拉列表

我试图用我的firebase数据填充下拉列表。我使用的是angular 9.1.9。请帮忙

类别.服务.ts

constructor(private db: AngularFireDatabase) { }

  getCategories() {
    return this.db.list('/categories', (ref) => ref.orderByChild('name'))
      .snapshotChanges()
      .pipe(
        map((actions) => {
          return actions.map((action) => ({
            key: action.key,
            val: action.payload.val(),
          }));
        })
      );
  }

product-form.component.html

<select [ngModel] id="category" class="form-control">
            <option value=""></option>
            <option *ngFor="let c of categories$ | async" [value]="c.key">
                {{c.payload.val().name}}
            </option>
        </select>

---

{{c.val.name}

会有所帮助，因为您的

val

对象已经包含

payload.val（）

，只需从中访问

name

属性即可

export class ProductFormComponent implements OnInit {

  categories$;
  constructor(categoryService: CategoryService) {
    this.categories$ = categoryService.getCategories();
  }