Ngrx 商店、效果、Http Ajax Angular 2 上的轮询设置
Ngrx Store, Effects, Http Ajax Polling Setup on Angular 2
我正在创建一个 Ngrx Angular 2 应用程序,并试图让我的 http 调用在一段时间间隔后继续轮询。我见过 interval()
函数的用法,但在 Ngrx 的情况下,当在 @Effect()
内完成服务调用时,它会出错。请指教:
@Injectable()
export class TasksEffects {
constructor(
private actions$: Actions,
private TS: TaskService
){}
@Effect()
onLoadTasksLoadTasks$: Observable<Action> = this.actions$.ofType(tasksActions.ActionTypes.LOAD_TASKS)
.switchMap(() => {
return this.TS.index()
.map((res) => new tasksActions.LoadTasksSuccessAction(res.json()))
.catch(err => of(new tasksActions.LoadTasksFailAction(err)));
});
我想每十秒 运行 switchMap 函数。这不起作用。
@Effect()
onLoadTasksLoadTasks$: Observable<Action> = this.actions$.ofType(tasksActions.ActionTypes.LOAD_TASKS)
.switchMap(() => {
return this.TS.index()
.map((res) => new tasksActions.LoadTasksSuccessAction(res.json()))
.catch(err => of(new tasksActions.LoadTasksFailAction(err)));
}).interval(10000);
类型错误为:
在 rxjs 5 中 interval()
是一个静态函数。您只能将其用作创作者 Observable.interval(1)
.
试试这个。
this.actions$.ofType(tasksActions.ActionTypes.LOAD_TASKS)
.skipUntil(Observable.interval(10000))
.switchMap(res => {...})
如另一个答案所述,interval
是一个静态函数,因此它在 Observable
原型中不存在 - 这就是您的错误受到影响的原因。
相反,您应该能够使用 timer
.
实现您想要的效果
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/of';
import 'rxjs/add/observable/timer';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/switchMap';
@Effect()
onLoadTasksLoadTasks$: Observable<Action> = this.actions$
.ofType(tasksActions.ActionTypes.LOAD_TASKS)
.switchMap(() => Observable
.timer(0, 10000)
.switchMap(() => this.TS.index()
.map((res) => new tasksActions.LoadTasksSuccessAction(res.json()))
.catch(err => Observable.of(new tasksActions.LoadTasksFailAction(err)))
)
);
使用 timer
,可以指定初始延迟,此处将其设置为零,以便计时器立即触发。之后,它将每十秒触发一次,但如果收到另一个 LOAD_TASKS
操作,switchMap
将看到它取消订阅并创建一个新的 timer
,等等
我正在创建一个 Ngrx Angular 2 应用程序,并试图让我的 http 调用在一段时间间隔后继续轮询。我见过 interval()
函数的用法,但在 Ngrx 的情况下,当在 @Effect()
内完成服务调用时,它会出错。请指教:
@Injectable()
export class TasksEffects {
constructor(
private actions$: Actions,
private TS: TaskService
){}
@Effect()
onLoadTasksLoadTasks$: Observable<Action> = this.actions$.ofType(tasksActions.ActionTypes.LOAD_TASKS)
.switchMap(() => {
return this.TS.index()
.map((res) => new tasksActions.LoadTasksSuccessAction(res.json()))
.catch(err => of(new tasksActions.LoadTasksFailAction(err)));
});
我想每十秒 运行 switchMap 函数。这不起作用。
@Effect()
onLoadTasksLoadTasks$: Observable<Action> = this.actions$.ofType(tasksActions.ActionTypes.LOAD_TASKS)
.switchMap(() => {
return this.TS.index()
.map((res) => new tasksActions.LoadTasksSuccessAction(res.json()))
.catch(err => of(new tasksActions.LoadTasksFailAction(err)));
}).interval(10000);
类型错误为:
在 rxjs 5 中 interval()
是一个静态函数。您只能将其用作创作者 Observable.interval(1)
.
试试这个。
this.actions$.ofType(tasksActions.ActionTypes.LOAD_TASKS)
.skipUntil(Observable.interval(10000))
.switchMap(res => {...})
如另一个答案所述,interval
是一个静态函数,因此它在 Observable
原型中不存在 - 这就是您的错误受到影响的原因。
相反,您应该能够使用 timer
.
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/of';
import 'rxjs/add/observable/timer';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/switchMap';
@Effect()
onLoadTasksLoadTasks$: Observable<Action> = this.actions$
.ofType(tasksActions.ActionTypes.LOAD_TASKS)
.switchMap(() => Observable
.timer(0, 10000)
.switchMap(() => this.TS.index()
.map((res) => new tasksActions.LoadTasksSuccessAction(res.json()))
.catch(err => Observable.of(new tasksActions.LoadTasksFailAction(err)))
)
);
使用 timer
,可以指定初始延迟,此处将其设置为零,以便计时器立即触发。之后,它将每十秒触发一次,但如果收到另一个 LOAD_TASKS
操作,switchMap
将看到它取消订阅并创建一个新的 timer
,等等