Aurelia中的数组订阅

Mat*_*vis 13 javascript aurelia aurelia-binding

假设我有一系列元素,除了在我的应用程序中显示列表外,我想将列表同步到服务器HttpClient.如何观察阵列的变化?我试过了:

@inject(ObserverLocator)
export class ViewModel {

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

但我既没有错误也没有记录消息.

Jer*_*yow 27

getObserver返回一个属性观察者,它将在ViewModel类实例的list属性更改时通知您.只有在为list属性分配新值时才会发生这种情况,即this.list = [1,2,3].如果你并没有使用新值list属性,而是通过变异属性的值push,pop,splice,等等,你要使用数组的观察员.使用ObserverLocatorgetArrayObserver方法-它需要一个参数,你要观察的数组:

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

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