javascript - Aurelia 中的数组订阅

Question

假设我有一个元素数组，除了在我的应用程序中显示列表之外，我还想将列表与HttpClient. 如何观察数组的变化？我试过了：

@inject(ObserverLocator)
export class ViewModel {

    constructor(obsLoc) {
        this.list = [];
        obsLoc.getObserver(this, 'list');
            .subscribe(li => console.log(li));
    }
}

但我既没有收到错误消息，也没有收到日志消息。

Answer 1

getObserverViewModel返回一个属性观察者，它会在类实例的list属性更改时通知您。这只会在您为list属性分配新值时发生，即this.list = [1,2,3]. 如果您没有为list属性分配新值，而是通过push、pop、splice等改变属性的值，您将需要使用数组观察器。使用ObserverLocator'sgetArrayObserver方法 - 它接受一个参数，即您要观察的数组：

import {ObserverLocator} from 'aurelia-binding'; // or from 'aurelia-framework'

@inject(ObserverLocator)
export class ViewModel {

    constructor(obsLoc) {
        this.list = [];
        obsLoc.getArrayObserver(this.list);
            .subscribe(splices => console.log(splices));
    }
}

2015 年 10 月更新

ObserverLocator 是 Aurelia 的内部“裸机”API。现在有一个可用于绑定引擎的公共 API：

import {BindingEngine} from 'aurelia-binding'; // or from 'aurelia-framework'

@inject(BindingEngine)
export class ViewModel {
  constructor(bindingEngine) {
    this.list = []; // any Array, Map and soon Set will be supported

    // subscribe
    let subscription = bindingEngine.collectionObserver(this.list)
      .subscribe(splices => console.log(splices));

    // be sure to unsubscribe **later**
    subscription.dispose();
  }
}