本文整理匯總了TypeScript中@ngrx/store.Store.asObservable方法的典型用法代碼示例。如果您正苦於以下問題:TypeScript Store.asObservable方法的具體用法?TypeScript Store.asObservable怎麽用?TypeScript Store.asObservable使用的例子?那麽, 這裏精選的方法代碼示例或許可以為您提供幫助。您也可以進一步了解該方法所在類@ngrx/store.Store
的用法示例。
在下文中一共展示了Store.asObservable方法的1個代碼示例,這些例子默認根據受歡迎程度排序。您可以為喜歡或者感覺有用的代碼點讚,您的評價將有助於係統推薦出更棒的TypeScript代碼示例。
示例1: constructor
constructor(
store: Store<IState>
) {
// In our example we're treating any change in global state
// as an example of user activity. So to start we need to
// just get an observable for the stream of state changes
//
let state$ = store.asObservable() as Observable<IState>;
// Now here's where the power of RxJS comes into play. We're going to user
// a technique where we react to state changes by mapping them to a new
// observable that emits a value after the timeour period expires.
//
state$
// We only want to start an activity timer when a user is actually logged
// in, so filter out any state changes where that flag is false.
//
.filter((x: IState) => x.loggedIn)
//
// Now we don't really care what the state change was in this context, and
// what we really want is an observable for our specific timeout value. So
// we map the state change to an observable that emits a single value after
// the timeout.
//
// Note, this also means that any state change we care about creates a *new*
// observable...and this is how we "reset" the timer when that happens.
//
.map((x: IState) => Observable.timer(5000))
//
// This is just for logging purposes in the demo so we can see when a new
// timer is started.
//
.do((x: any) => console.log("Activity detected! Timer has reset to 5 seconds"))
//
// Now here's the slick part (IMO). Each time a new "timeout" observable is
// created we want to make sure it replaces any timer we were subscribed to
// before. In other words, as soon as a new timer is started we want to use that
// one and just ignore anything we had before.
//
// In RxJS that's a simple operator called switch().
//
.switch()
//
// Finally, we need to subscribe to the timer observable to decide what to do
// should it actually fire (i.e., the timeout actually expired). Here we're
// just going to dispatch a new action that indicates the timeout expired. Then
// the reducer can decide what it actually means based on the state of the
// application at the time.
//
.subscribe((x) => {
console.log("Inactivity interval expired! Dispatching timeout event")
store.dispatch({type: ACTIVITY_TIMEOUT_OCCURRED});
});
}