Verbinden Array zu Observable ohne .interval() in Angular2 Typescript

Question

Gibt es eine Möglichkeit, die gleiche Funktionalität ohne "interval()" Teil zu tun?

Ich möchte nur das Array zu einem Observable verbinden, und dann nur das Array aktualisieren, und das Observable zu beobachten, dass Array und reagieren.

Wenn dies eine gute Lösung ist, gibt es eine Möglichkeit zu implementieren, und wo, die .distinctUntilChanged() in diesem, so dass es keine neuen Werte ausgibt, wenn die Daten identisch sind, dann dieses "Intervall (10)" wird nicht der Flaschenhals sein. Hier

ist die Plunker: http://plnkr.co/edit/xlWSTz8gNfByTnT1REw5?p=preview

import {Component} from 'angular2/core'; 
import * as Rx from 'rxjs/Rx' 

@Component({ 
    selector: 'a-webapp', 
    template:` 

    <div> 
    <h2>{{name}}</h2> 

    <button (click)="addToArray()">Add</button> <button (click)="resetArray()">Reset</button> 
    <ul> 
     <li *ngFor="let item of latest$ | async">{{ item | json }}</li> 
    </ul> 

    {{ data | json }} 

    </div> 

    ` 
}) 
export class AppComponent { 

    data = ["one", "two", "three"] 
    data$: Rx.Observable<Array<string>>; 
    latest$: Rx.Observable<Array<string>>; 

    constructor() {} 

    ngOnInit() { 

     this.data$ = Rx.Observable.interval(10).concatMap(y => { 
      return Rx.Observable.of(this.data) 
     }) 

     this.latest$ = Rx.Observable.combineLatest(this.data$, (data) => { 
      return data.map(d => { 
       return d + " is a number" 
      }) 
     }) 
    } 

    addToArray() { 
     this.data.push('more numbers') 
    } 

    resetArray() { 
     this.data = ["one", "two", "three"] 
    } 

} 

Answer 1

"... und die beobachtbaren, um dieses Array zu beobachten und reagieren"

Ich denke, es ist besser, die beobachtbare haben einen neuen emittiert Wert jedes Mal, wenn das Array ändert

In Ihrem Fall:

export class AppComponent { 
    data = ["one", "two", "three"]; 
    data$: Rx.BehaviorSubject<Array<string>>; // or data$: Rx.Subject<Array<string>> 
    latest$: Rx.Observable<Array<string>>; 

    constructor() {} 

    ngOnInit() { 
    this.data$ = new Rx.BehaviorSubject<Array<string>>(this.data); 

    this.latest$ = this.data$.map(data => data.map(
     d => "" + d + " is a number" 
    )); 
    } 

    addToArray() { 
    this.data.push('more numbers'); 
    this.data$.next(this.data); 
    } 

    resetArray() { 
    this.data = ["one", "two", "three"]; 
    this.data$.next(this.data); 
    } 
}