Angular 类型'；可观察<；{}>；不可分配给类型'；可观察的'；

前言：我知道还有很多其他的问题都有同样的错误，但我似乎仍然无法解决我自己的问题

我有一个简单的服务和另一个简单的组件。我正努力密切关注angular2 hero教程，以下是我的代码：

地点

---

location-search.service.ts

---

从'@angular/core'导入{Injectable}；
从'@angular/Http'导入{Http，Response}；
从“rxjs”导入{Observable}；
从“./Location”导入{Location}；
@可注射（）
导出类位置搜索服务{
构造函数（私有http:http）{}
搜索（术语：字符串）：可观察{
返回此文件。http
.get（`api\u url\u我已删除`）
.map（（r:Response）=>r.json（）.data作为位置[]）；
}
}

location-search.component.ts

---

从'@angular/core'导入{Component，OnInit}；
从'@angular/Router'导入{Router}；
从“rxjs/Observable”导入{Observable}；
从'rxjs/Subject'导入{Subject}；
从“./location search.service”导入{LocationSearchService}；
从“./Location”导入{Location}；
@组成部分({
选择器：'位置搜索'，
templateUrl:'location search.component.html'，
样式URL:['assets/styles.css']，
提供者：[LocationSearchService]
})
导出类LocationSearchComponent实现OnInit{
位置：可见；
private searchTerms=新主题（）；
建造师(
private locationSearchService:locationSearchService，
专用路由器：路由器{}
搜索（术语：字符串）：无效{
this.searchTerms.next（术语）；
}
ngOnInit（）：void{
this.locations=this.searchTerms//term
？此.locationSearchService.search（术语）
：可观察到的（[]））
.catch（错误=>{
console.log（错误）；
（[]）的可观测收益率；
})
}
}

我不断得到错误：

类型“Observable”不可分配给类型“Observable”。在第29行第9列

---

我是不是做错了什么？谢谢你的帮助

我不能告诉你确切的问题，但我也为此挣扎了几次

.switchMap（）

有问题。Idk，如果是打字脚本问题还是什么。。 也许只是打字文件不好

你必须投下它：

ngOnInit（）：void{
this.locations=this.searchTerms//term
？此.locationSearchService.search（术语）
：可观察到的（[]））
.catch（错误=>{
console.log（错误）；
（[]）的可观测收益率；
})
}

或者（如您所述）将函数

switchMap（）

和

catch（）

与类型声明一起使用，如下所示：

ngOnInit（）：void{
this.locations=this.searchTerms//term
？此.locationSearchService.search（术语）
：可观察到的（[]））
.catch（错误=>{
console.log（错误）；
（[]）的可观测收益率；
})
}

谢谢！我还通过执行

.switchmap.

和

.catch

解决了这个问题。啊，太好了。我不知道-谢谢！也将更新我的答案。Thx，你的第一个解决方案为我做到了。

export class Location {
    name: string;
    type: string;
    c: string;
    zmw: string;
    tz: string;
    tzs: string;
    l: string;
    ll: string;
    lat: string;
    lon: string;
}

import { Injectable }       from '@angular/core';
import { Http, Response }   from '@angular/http';
import { Observable }       from 'rxjs';

import { Location }         from './location';

@Injectable()
export class LocationSearchService {
    constructor(private http: Http) {}

    search(term: string): Observable<Location[]> {
        return this.http
            .get(`api_url_i've_removed`)
            .map((r: Response) => r.json().data as Location[]);
    }
}

import { Component, OnInit }    from '@angular/core';
import { Router }               from '@angular/router';
import { Observable }           from 'rxjs/Observable';
import { Subject }              from 'rxjs/Subject';

import { LocationSearchService }    from './location-search.service';
import { Location }                 from './location';

@Component({
    selector: 'location-search',
    templateUrl: 'location-search.component.html',
    styleUrls: ['assets/styles.css'],
    providers: [ LocationSearchService ]
})

export class LocationSearchComponent implements OnInit {
    locations: Observable<Location[]>;
    private searchTerms = new Subject<string>();

    constructor(
        private locationSearchService: LocationSearchService,
        private router: Router) {}

    search(term: string): void {
        this.searchTerms.next(term);
    }

    ngOnInit(): void {
        this.locations = this.searchTerms // <- ERROR HERE
            .debounceTime(300)
            .distinctUntilChanged()
            .switchMap(term => term
                ? this.locationSearchService.search(term)
                : Observable.of<Location[]>([]))
            .catch(error => {
                console.log(error);
                return Observable.of<Location[]>([]);
            })
    }
}