绑定到Observable< enum>在Angular中可能是这样的吗?
<a [ngClass]="{selected: (mapToolBarMode$| async) === 0 }" />
要么
<a [ngClass]="{selected: (mapToolBarMode$| async) === MapMode.Pan }" />
其中mapToolBarMode $是可观察的
它似乎没有做任何事情,因为可观察到的变异.
我认为它可能与构造函数中不可用的值有关,如果我这样做它可以工作,但我真的不想为MapMode枚举中的每个值执行此操作:
private mapModes: typeof MapMode = MapMode;
private isPanSelected = true;
ngOnInit() {
this.mapToolBarMode.subscribe(v => {
this.isPanSelected = (v === this.mapModes.Pan);
})
}
…
[ngClass]="{selected: isPanSelected }"
更新
事实证明,这与调用角度组件的遗留代码有关.那些调用需要在ngzone的上下文中运行,否则就没有循环
也许你错过了问题中的一个细节,在我的例子中它的工作正常:
或者您的观察结果已经完成? Http请求可能吗?
@Component({
selector: 'my-app',template: `
<div>
<h2 (click)="toggle()"
[ngClass]="{selected: (mapToolBarMode$| async) === 0 }"
>
Hello {{name}},click to toggle color
</h2>
</div>
`,styles: [
'.selected { color: red; }'
]
})
export class App {
name:string;
mapToolBarMode$= new Subject();
constructor() {
this.name = 'Angular2'
}
private _curState = 1;
toggle() {
if (++this._curState > 1) this._curState = 0;
this.mapToolBarMode$.next(this._curState);
}
}
现场演示:https://plnkr.co/edit/h0YIPpCh9baJgxCsBQrY?p=preview