Pau*_*aul 7 tap pipe rxjs angular ngxs
我正在玩管道和订阅.如果我使用带有水龙头的管道,则没有任何东西会登录控制台.如果我使用订阅,它正在工作.那么我做错了什么?
import { Observable } from 'rxjs';
import { tap, take } from 'rxjs/operators';
this.store.select(state => state.auth.authUser).pipe(
take(1),
tap((data) => {
//Not Working - no console output
console.log('[Tap] User Data', data);
})
);
this.store.select(state => state.auth.authUser).subscribe((data) => {
// Working - user data output in console
console.log('[Subscribe] User Data', data);
})
Run Code Online (Sandbox Code Playgroud)
我在Angular 6中使用RxJs 6,TypeScript和ngxs作为存储.
Mar*_*eld 13
我的回答分为两部分......你问的是什么,你需要什么.当存在活动订阅时,Observable的值仅流经管道运算符.这就是你看到这种行为的原因.所以你应该做这样的事情:
this.store.select(state => state.auth.authUser).pipe(
take(1),
tap((data) => {
console.log('[Tap] User Data', data)
})
).subscribe();
Run Code Online (Sandbox Code Playgroud)
但是你正在寻找的是状态快照.你可以这样做:
let data = this.store.selectSnapshot(state => state.auth.authUser);
console.log('[selectSnapshot] User Data', data);
Run Code Online (Sandbox Code Playgroud)
tap(或在旧版本的 RxJS 中执行)->透明地执行操作或副作用,例如日志记录(如定义所示)。
但是,就您而言,您忘记了“订阅()”您的 Observable,这就是为什么您在控制台中看不到您的“用户数据”。
另一方面,在第二种情况下,您已经订阅了一个 Observable。
知道了!我必须附加订阅()。所以它是:
this.store.select(state => state.auth.authUser).pipe(
take(1),
tap((data) => {
console.log('[Tap] User Data', data)
})
).subscribe();
Run Code Online (Sandbox Code Playgroud)