我想知道当我使用 ngrx stroe 时是否可以部分使用异步管道。
例如
// ts file
this.name$ = this.store.pipe(
select(SOME.STATE),
map((item) => {
return item.name;
})
)
// html file
<p>{{name$ | async}}</p>
这很简单,但如果我需要怎么办
// ts file
this.store.pipe(
select(SOME.STATE),
)
.subscribe(item => {
this.name = item.name;
this.age = item.age // <-
})
someMethod() {
const age = this.age;
// ...some processes using 'age' data which from store
}
// html file
<p>{{name}}</p>
像上面一样,如果我有多个数据并且必须进行一些后处理(例如someMethod()
),我不确定如何处理异步管道。没有更多的异步管道意味着我还必须手动unsubscribe
,从而使代码更加冗长。
我试过以下
// ts file
this.name$ = this.store.pipe(
select(SOME.STATE),
map((item) => {
return item.name;
})
)
this.store.pipe(
select(SOME.STATE),
)
.subscribe(item => {
this.age = item.age
})
someMethod() {
const age = this.age;
// ...some processes using 'age' data which from store
}
// html file
<p>{{name$ | async}}</p>
工作,但我想知道是否有更好的方法。
谢谢。
使用 tap
运算符执行此操作,而不是订阅。
this.name$ = this.store.pipe(
select(SOME.STATE),
tap(item => this.age = item.age),
map((item) => {
return item.name;
}));
不过,仍然没有理由这样做。相反,您应该简单地拥有另一个可观察对象,例如age$
.