类型 Observable<Response> 不可分配给类型 Observable<List<Todo>>

Question

我正在尝试按照 this application 松散地构建一个应用程序，但我遇到了一个 TypeScript 错误，我想要一个错误的解释。据我所知，我正在做我应该做的事情。

这是我到目前为止编写的代码：

import {Injectable,Inject} from '@angular/core';
import {Http,Headers,URLSearchParams, Response} from '@angular/http';
import {List, Record} from 'immutable';
import {Observable} from "rxjs/Observable";


const TodoRecord = Record({
    id: 0,
    description: "",
    completed: false
});

export class Todo extends TodoRecord {

    id:number;
    description:string;
    completed: boolean;

    constructor(props: any) {
        super(props);
    }

}

@Injectable()

export class TodoBackendService {
    constructor(private http: Http){
        this.http = http;
    }

    getAllTodos(){
        return this.http.get("/todo");
    }

    saveTodo(newTodo: Todo): Observable<List<Todo>> {
        var headers = new Headers();
        headers.append("Content-Type", "application/json; chartset=utf-8");

        return this.http.post("/todo", JSON.stringify(newTodo.toJS()),{headers}).share();
    }
}

这是代码行 Visual Studio 代码标识为错误：

 return this.http.post("/todo", JSON.stringify(newTodo.toJS()),{headers}).share();

这是我在 VS Code 中收到的错误消息：

如有任何帮助，我们将不胜感激。

Answer 1

消息说明了一切。一个 http post returns 一个 Observable<Response>，而不是一个 Observable<List<Todo>>。

您需要使用 map() 从返回的响应中创建 List<Todo>。

Answer 2

这是地图的使用方法。假设 response.json() returns 一个 ToDo 模型数组。

saveTodo(newTodo: Todo): Observable<List<Todo>> {
    var headers = new Headers();
    headers.append("Content-Type", "application/json; chartset=utf-8");

    return this.http.post("/todo", JSON.stringify(newTodo.toJS()),{headers})
        .map((response: Response) => (<ToDo[]>response.json())).share();
}

Answer 3

试试这个..

saveTodo(newTodo: Todo) : Observable<any> {
        var headers = new Headers();
        headers.append('Content-Type', 'application/json; charset=utf-8');
        return this.http.post('/todo',JSON.stringify(newTodo.toJS()),{headers}).share();
    }

类型 Observable<Response> 不可分配给类型 Observable<List<Todo>>

Type Observable<Response> is not assignable to type Observable<List<Todo>>

system.reactive

rxjs

typescript

angular