异步管道与角度4中的方法调用无限调用

Question

我需要提供带有动态选项的select UI元素，我有一个方法可以根据输入返回一个observable

TypeScript（组件类）

getCars(type : string, engine : string) : Observable<Cars>{
    return this.carService.getCars(type,engine);
} 

在HTML中，我让我的元素为数据调用此方法

Html（模板文件）

<ng-select [items]="getCars(type,engine) | async"
    bindLabel="value"
    bindValue="id"
</ng-select>

但这导致服务被无限调用。我不想使用ngOnInit，因为我需要动态分配observable

我正在使用this UI element for select

Answer 1

这是预期的行为，以及角度变化检测的工作原理，从视图中调用方法并使用属性不是一个好主意

this.cars = getCars(type,engine)

Answer 2

我通过调用此方法更改可观察变量

来实现它 组件

中的

    car$:Observable<cars> 
getCars(type : string, engine : string) {
    this.car$=this.carService.getCars(type,engine);
} 

模板

中的

<ng-select [items]="car$ | async"
    (focus)="getCars(type,engine)"
    bindLabel="value"
    bindValue="id"
</ng-select>