如何将observable传递给angularjs2中的父组件？

我有两个组件，SearchComponent和RuleListComponent。搜索是RuleList的子项。如何将observable传递给angularjs2中的父组件？

我想的SearchComponent使用APIService下载数据。这些数据必须以可观察的方式传递给RuleList。

的SearchComponent：

export class SearchComponent implements OnInit { 
    items: Observable<Array<string>>; 
    term = new FormControl(); # term is async 

    constructor(private apiService: APIService) { } 

    ngOnInit() { 
    this.items = this.term.valueChanges 
     .debounceTime(1000) 
     .distinctUntilChanged() 
     .switchMap(term => this.apiService.fetch('rule', term)); 
    } 
}

APIService：

@Injectable() 
export class APIService { 
    baseUrl: string; 

    constructor(private http: Http) { 
    this.baseUrl = '//127.0.0.1:8000/'; 
    } 

    fetch(term: string) : Observable<any> { 
    console.log('searching'); 
    var search = new URLSearchParams(); 
    search.set('search', term); 
    return this.http.get(this.baseUrl, { search }) 
        .map(response => response.json()); 
    } 
}

我怎样才能保持距离的SearchComponent将数据传递到RuleListComponent异步根据不断变化的期限多长？

来源

2016-10-06 Marksman

将'items'存储在'APIService'上，以便您的'SearchComponent'和'RuleListComponent'可以访问它们 –

一个好主意是制作一个SearchService并且同时有RuleListComponent和SearchComponent注入这个服务。

然后让SearchService注入ApiService并将项目设置在SearchService中，而不是在您的组件中。组件不应该用于存储数据

来源

2016-10-06 12:51:42 PierreDuc

如何将observable传递给angularjs2中的父组件？

回答

相关问题