Angular2は、http.getに別名を付けて使用します。

Question

私はHttp.Getについてもっと学びたいと思っています。私は、HTTP呼び出しを模擬するためにjsonファイルを使用しています。呼び出しの後、行を一意の状態に制限したい。私は、distinct（help on Rxjs distinct）と呼ばれるRxjsコマンドがあることを知っています。しかし、私は別名の構文を理解していません。私はこのコードを実行すると、私は状態の配列を取得します。しかし、私が別名を追加すると、まだテキサスのような状態が重複しています。ここで

public getStates(): Observable<IState[]> { 
    return this._http.get(this.stateUrl) 
     .map((res: Response) => <IState[]>res.json()) 
     // distinct by state name 
     .distinct((x) => return x.state) 
    ; 
    }  

はISTATE

export interface IState { 
    id: number; 
    state: string; 
    city: string; 
    name: string; 
} 

だけのユニークな状態で行を取得しようとするためのインタフェースです。

私はthis Github project

Answer 1

あなたはこの状況では、独特の意味をちょっと混乱させます！ このdistinctは、Observableの内容ではなく、Observableからの応答をフィルタリングするためのものです。ここでは、あなたのjsonオブジェクトを「区別」（フィルター）しようとしていますが、別名はObservableによって応答（複数）を「解決」します。したがって、観察可能な部分が同じ応答を複数回「解決」すると、.distinctが原因で1回だけ受信されます。 Observableが1つのjson（例えば[{0：a、1：b、2：c}]）を返し、同じjson応答を2回返すと、 "subscribers" .distinctはそれを「フィルタリング」し、結果として解雇されないため、2度受信しません！ここ

詳細：https://github.com/Reactive-Extensions/RxJS/blob/master/doc/api/core/operators/distinct.md

だから、あなたが探しているものを、あなたのJSON内の重複した結果を「フィルタリング」する方法です。 答えは簡単です：ループを使用してプロパティ/値、またはこのメソッドが既に実装されているかもしれないアンダースコアのようなライブラリをチェックしてください。

Answer 2

IState上のコードのためのレポを持つオブジェクトです。あなたは正確にother.Youがdocumentationで見ることができ、それぞれからそれら明確な作るものが定義する必要があり、例えばオブジェクト明確な

を作るかを定義する方法があります：

/* Without key selector */ 
var source = Rx.Observable.of(42, 24, 42, 24) 
    .distinct(); 

var subscription = source.subscribe(
    function (x) { 
    console.log('Next: %s', x); 
    }, 
    function (err) { 
    console.log('Error: %s', err); 
    }, 
    function() { 
    console.log('Completed'); 
    }); 

// => Next: 42 
// => Next: 24 
// => Completed 

/* With key selector */ 
var source = Rx.Observable.of({value: 42}, {value: 24}, {value: 42}, {value: 24}) 
    .distinct(function (x) { return x.value; }); 

var subscription = source.subscribe(
    function (x) { 
    console.log('Next: %s', x); 
    }, 
    function (err) { 
    console.log('Error: %s', err); 
    }, 
    function() { 
    console.log('Completed'); 
    }); 

// => Next: { value: 42 } 
// => Next: { value: 24 } 
// => Completed 

Answer 3

.distinct((x) => return x.state)を呼び出すときに、x変数がhttps://github.com/ATXGearHead12/distinct/blob/master/src/api/state.jsonの配列全体であるという問題があります。その後、プロパティx.stateは存在しません。

したがって、配列内の各項目に対してdistinctを呼び出す必要があります。詳細については、

this._http.get(this.stateUrl) 
    .map((res: Response) => <IState[]>res.json()) 
    .concatMap(arr => 
     Observable.from(arr).distinct((x) => return x.state) 
    ) 
    .toArray(); // collect all items into an array