在 Angular2 Typescript 中不使用 .interval() 将数组连接到 Observable

Question

有没有办法在没有 "interval()" 部分的情况下实现同样的功能？

我只想将数组连接到一个可观察对象，然后只更新数组，然后可观察对象观察该数组并做出反应。

如果这是一个很好的解决方案，是否有一种方法可以将 .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"]
    }

}

Answer 1

"... and the observable to watch that array and react"

我认为每次数组更改时让 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);
  }
}

在 Angular2 Typescript 中不使用 .interval() 将数组连接到 Observable

Connect Array to Observable without .interval() in Angular2 Typescript

rxjs

typescript

rxjs5

angular