Angular 2 - 为什么此服务不返回任何数据

时间:2017-11-21 17:42:55

标签: angular service observable

我有一个服务查询我的机器上本地托管的json文件。调用对服务的查询,但是从服务查询返回到组件的json数据始终为空。但是,使用浏览器中的开发人员工具,我可以看到带有数据的json文件确实返回了200 ok。

我对返回的可观察数据的订阅是否存在根本错误?非常感谢任何帮助。

@Injectable()
export class UserService {

    constructor(
        public http: Http,
    ) {}

    search(query: string): Observable<UserInfo[]> {
        return this.http.get('http://localhost/test.json')
        .map(res => res.json());


    }
}




valuechange(query) {

    console.log("calling service from component");

    this.inputFormControl.valueChanges
    .debounceTime(4000)
    .distinctUntilChanged()
    .subscribe(query => this.userService.search(query)
    .subscribe(data => {
        {
            this.data = data   
            console.log('this.users=' + this.data);
            console.log('this.users.length=' + this.data.length);
        }

        })); 
    console.log("data on return from service is " + this.data[1]);
}

1 个答案:

答案 0 :(得分:1)

您应该在可观察序列中使用类似switchMap的内容来将valueChanges事件发射器与您的userService.search observable链接起来。

this.inputFormControl.valueChanges
.debounceTime(4000)
.distinctUntilChanged()
.switchMap(query => this.userService.search(query))
.subscribe(data => {
    this.data = data   
    console.log('this.users=' + this.data);
    console.log('this.users.length=' + this.data.length);
});