Firebase Firestore ngIf插值

我拥有名为vehicles的firebase系列： 每个文档都有相同的字段。我只想打印那些可用的文档。

available

字段是

boolean

类型。如果我执行一些操作，则可用的

将变为
false

因此，我将
车辆
集合导入我的组件：

  export class VehiclesComponent implements OnInit {

  vehiclesCollection: AngularFirestoreCollection<Vehicle>
  vehicles: Observable<Vehicle[]>;

  constructor(private afs: AngularFirestore) {
    this.vehiclesCollection = afs.collection('vehicles')

    this.vehicles = this.vehiclesCollection.valueChanges()
    console.log(this.vehicles.subscribe(function(val) { console.log(val.map(function(x) { x.avaiable }))}))

  }

  ngOnInit() {
  }
}

我遇到以下错误：

`compiler.js:485 Uncaught Error: Template parse errors:
TypeError: Cannot read property 'toUpperCase' of undefined ("

<ng-container *ngFor="let vehicle of vehicles | async">
  <div [ERROR ->]*ngIf="{{vehicles.avaiable}}">
    {{ vehicle.brandOfCar }}
  </div>
  ...
   `

`compiler.js:485未捕获错误：模板解析错误：
TypeError:无法读取未定义（“”）的属性“toUpperCase”
]*ngIf=“{vehicles.available}}”>
{{vehicle.brandOfCar}
...
`

我做错了什么？我如何克服这个问题？
您不能像这样进行插值
*ngIf=“{{vehicles.available}}”

试着不戴花括号

*ngIf="vehicles.avaiable"

如果您只想显示具有
true
值的车辆，请在查询中这样做

this.vehiclesCollection = afs.collection('vehicles', ref => ref.where('avaiable', '==', true))

然后，它将只下载您想要显示的项目。别忘了添加索引

this.vehiclesCollection = afs.collection('vehicles', ref => ref.where('avaiable', '==', true))