在Angular2 Typescript中没有.interval()的情况下将Array连接到Observable

Ted*_*ddy 0 rxjs typescript rxjs5 angular

有没有办法在没有"interval()"部分的情况下执行相同的功能?

我只想将数组连接到一个observable,然后只需更新数组,并观察observable以观察该数组并做出反应.

如果这是一个很好的解决方案,有没有办法实现,并且.distinctUntilChanged()在这里,如果数据是相同的,它不会发出新的值,那么这个"interval(10)"将不是瓶颈.

这是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"]
    }

}
Run Code Online (Sandbox Code Playgroud)

Can*_*yen 13

"......观察那个阵列并做出反应的观察者"

我认为每次数组更改时,observable都会发出一个新值

在你的情况下:

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);
  }
}
Run Code Online (Sandbox Code Playgroud)