Question

我对Angular 2服务中Observables与变量的使用有疑问。前者似乎是首选方式，但我无法找到原因。

给出如下样本服务：

@Injectable()
export class TestService {
    // Method 1
    public data = {x: Math.random(), y: Math.random()};

    // Method 2
    private _data$:BehaviorSubject<any> = new BehaviorSubject({x: Math.random(), y: Math.random()});
    public data$:Observable<any> = this._data$.asObservable();

    constructor() {
        setInterval(() => {
            this.data = {x: Math.random(), y: Math.random()};
            this._data$.next({x: Math.random(), y: Math.random()});
        }, 500);
    }
}

我基本上看到了两种在组件中使用数据的方法。只是直接使用变量：

<pre>{{testService.data | json}}</pre>

使用Observable：

<pre>{{(testService.data | async) | json}}</pre>

两者似乎都有效，那么使用更精细的基于Observable的方法有什么好处呢？

Plunker：https://plnkr.co/edit/1qVDSZwq2NVgZsWFPnii?p=preview

Answer 1

Observable将值更改推送到订阅更改的组件和服务。

变量需要轮询，因此它具有巨大的性能优势。

特别是如果存在计时问题，例如组件需要服务从服务器获取的服务的值。组件如何知道可用的值。

使用可观察的组件只是订阅并在值到达时被调用。

Angulars change detection直接支持observables。当使用ChangeDetectionStrategy.OnPush并且视图使用异步管道（<div>{{myObservable | async}}</div>）绑定到observable时，除非observable推送新值，否则不会执行更改检测。

Observables还有其他好处。请参阅示例https://blog.thoughtram.io/angular/2016/01/06/taking-advantage-of-observables-in-angular2.html

Answer 2

不同之处在于，observables是一个流，您可以拥有多个流的订阅者。而且你还可以获得流的所有优点 - 热，冷的obervables，回复，过滤器等。

Angular 2服务中的Observables与变量

2 个答案: