Html 使ngrx影响REST呼叫
我正在使用ngrx/effects开发角休息应用程序,我正在使用示例应用程序。我试图替换http REST端的硬编码json数据。我收到错误“Effect”GetTodoEffects.todo$“调度了一个无效操作”。你能帮我解决这个问题吗。每件事都和git代码一样,除了我在下面粘贴的效果代码。 效果代码:Html 使ngrx影响REST呼叫,html,json,angular,rest,json-server,Html,Json,Angular,Rest,Json Server,我正在使用ngrx/effects开发角休息应用程序,我正在使用示例应用程序。我试图替换http REST端的硬编码json数据。我收到错误“Effect”GetTodoEffects.todo$“调度了一个无效操作”。你能帮我解决这个问题吗。每件事都和git代码一样,除了我在下面粘贴的效果代码。 效果代码: import 'rxjs/add/operator/map'; import 'rxjs/add/operator/mergeMap'; import 'rxjs/add/operator
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/mergeMap';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/debounceTime';
import 'rxjs/add/operator/withLatestFrom'
import { of } from 'rxjs/observable/of';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { Action, Store } from '@ngrx/store';
import { Actions, Effect, toPayload } from '@ngrx/effects';
import * as Act from '../actions/app.actions';
import * as fromStore from '../reducers';
import { HttpClient } from '@angular/common/http';
@Injectable()
export class GetTodoEffects {
@Effect() todo$ = this.actions$.ofType(Act.GET_TODO)
.map(toPayload)
.withLatestFrom(this.store$)
.mergeMap(([ payload, store ]) => {
return this.http$
.get(`http://localhost:4000/data/`)
.map(data => {
return [
new Act.GetTodoSuccess({ data: data })
]
})
.catch((error) => {
return [
new Act.GetTodoFailed({ error: error })
]
})
});
constructor(
private actions$: Actions,
private http$: HttpClient,
private store$: Store<fromStore.State>
) {}
}
我首先怀疑的是阵列。尝试将其更改为可观察的
return this.http$
.get(`http://localhost:4000/data/`)
.map(data => {
// You don't need an array because it's only 1 item
// If you want array use `Observable.from([ /* actions here */ ])`
// but then you'll need to change `map` above to
// `mergeMap` or `switchMap`
// (no big difference for this use case,
// `switchMap` is more conventional in Ngrx effects)
return new Act.GetTodoSuccess({ data: data });
})
.catch((error) => {
// You probably haven't called this yet,
// but `catch` must return `Obsrvable`
// Again, if you want an array use `Observable.from([ /* array */ ])`
return Observable.of(
new Act.GetTodoFailed({ error: error })
);
})
谢谢。。我得到了响应。但是,在catch块中,我得到了这个错误——“错误TS2339:type'typeof Observable'上不存在属性'of'。尝试添加
import'rxjs/add/Observable/of'代码>到文件顶部。谢谢Meligy。我在显示json数据时遇到了一些问题。我发布了新问题-。你能帮帮我吗?没问题。完成:)
return this.http$
.get(`http://localhost:4000/data/`)
.map(data => {
// You don't need an array because it's only 1 item
// If you want array use `Observable.from([ /* actions here */ ])`
// but then you'll need to change `map` above to
// `mergeMap` or `switchMap`
// (no big difference for this use case,
// `switchMap` is more conventional in Ngrx effects)
return new Act.GetTodoSuccess({ data: data });
})
.catch((error) => {
// You probably haven't called this yet,
// but `catch` must return `Obsrvable`
// Again, if you want an array use `Observable.from([ /* array */ ])`
return Observable.of(
new Act.GetTodoFailed({ error: error })
);
})