角2ルータがObservableで解決する

Question

角2 RC.5のリリース後、ルータ解決が導入されました。 Here私はObservableを使ってサーバーに要求した場合、Promiseの例を示しました。

search.service.ts

... 
searchFields(id: number) { 
    return this.http.get(`http://url.to.api/${id}`).map(res => res.json()); 
} 
... 

検索resolve.service.ts

import { Injectable } from '@angular/core'; 
import { Router, Resolve, ActivatedRouteSnapshot } from '@angular/router'; 
import { Observable } from 'rxjs/Observable'; 

import { SearchService } from '../shared'; 

@Injectable() 
export class SearchResolveService implements Resolve<any> { 

    constructor(
    private searchService: SearchService , 
    private router: Router 
) {} 

    resolve(route: ActivatedRouteSnapshot): Observable<any> | Promise<any> | any { 
    let id = +route.params['id']; 
    return this.searchService.searchFields(id).subscribe(fields => { 
     console.log('fields', fields); 
     if (fields) { 
     return fields; 
     } else { // id not found 
     this.router.navigate(['/']); 
     return false; 
     } 
    }); 
    } 
} 

search.component.ts

ngOnInit() { 
    this.route.data.forEach((data) => { 
    console.log('data', data); 
    }); 
} 

ではなく、実際のデータのObject {fields: Subscriber}を取得します。

Answer 1

サービスでsubscribe()に電話して、ルートを購読しないでください。

変更

return this.searchService.searchFields().subscribe(fields => { 

import 'rxjs/add/operator/first' // in imports 

return this.searchService.searchFields().map(fields => { 
    ... 
}).first(); 

（subscribe()によって返される）Observable代わりSubscriptionで戻される。このように。

現在、ルータは観察可能なものが閉じるのを待ちます。 first()演算子を使用すると、最初の値が出力された後に閉じられることを保証できます。