Les Paul Les Paul - 1 month ago 9
TypeScript Question

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

I'm trying to build an application loosely following this application but I am getting a TypeScript error and I'd like an explanation of what is wrong. To the best of my knowledge I'm doing what I'm supposed to.

Here's the code I've written thus far:

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();
}
}


This is the line of code Visual Studio Code identifies as an error:

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


And this is the error message I get in VS Code:

enter image description here

Any help would be much appreciated.

Answer

The message says it all. An http post returns an Observable<Response>, not an Observable<List<Todo>>.

You need to use map() to create a List<Todo> from the returned response.