Aurelia的房产变更订阅

Mat*_*vis 34 javascript ecmascript-6 aurelia

我在我的viewmodel上有一个属性,我想听,并根据其值触发事件,如下所示:

class viewModel {
  constructor() {
    this.value = '0';
    let val = 2;
    subscribe(this.value, callbackForValue);
    subscribe(val, callbackForVal);
  }
}
Run Code Online (Sandbox Code Playgroud)

这是Aurelia的特色吗?如果是这样,我将如何设置这样的订阅?

Jer*_*yow 53

在一些插件中,我一直在使用DI ObserverLocator从容器中获取实例:

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

@inject(ObserverLocator)
export class Foo {
    constructor(observerLocator) {
        this.observerLocator = observerLocator;
    }
    ...
}
Run Code Online (Sandbox Code Playgroud)

然后你可以做这样的事情:

var subscription = this.observerLocator
    .getObserver(myObj, 'myPropertyName')
    .subscribe(myCallback);
Run Code Online (Sandbox Code Playgroud)

当您准备处置订阅时,请调用它:

subscription();
Run Code Online (Sandbox Code Playgroud)

我认为这一切都有可能发生变化,但如果你需要的话,你可以立即使用它.

更多信息在这里

2015年10月更新

ObserverLocator是Aurelia的内部"裸机"API.现在有一个可以使用的绑定引擎的公共API:

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

@inject(BindingEngine)
export class ViewModel {
  constructor(bindingEngine) {
    this.obj = { foo: 'bar' };

    // subscribe
    let subscription = bindingEngine.propertyObserver(this.obj, 'foo')
      .subscribe((newValue, oldValue) => console.log(newValue));

    // unsubscribe
    subscription.dispose();
  }
}
Run Code Online (Sandbox Code Playgroud)

  • @ChiRow请不要滥用EventAggregator!它可以在这种情况下使用,但通常情况下,如果您正在考虑订阅者,您正在考虑紧密耦合的行为,而EventAggregator则用于松散耦合的行为. (3认同)
  • @ jeremy-danyow干得好,让我们不要忘记在api确实改变的时候更新:) (3认同)

小智 12

根据我杀死书呆子,可观察属性对绑定的开销较小 .

import {observable} from "aurelia-framework";

export class Example {

    @observable
    public description: string;

    private descriptionChanged(newValue: string, oldValue: string): void {

    }
}
Run Code Online (Sandbox Code Playgroud)


Mar*_*son 10

根据其值监听和触发事件

使用TypeScript的代码片段,希望能让您了解一下:

import {bindingMode} from "aurelia-binding";

export class Example{

    @bindable
    public description: string;

    private descriptionChanged(newValue: string, oldValue: string): void {
        console.log(newValue, oldValue);
    }
}
Run Code Online (Sandbox Code Playgroud)

方法名称应遵循惯例 `${propertyName}Changed`


编辑:这正是Decade Moon在上述评论中所建议的:Aurelia的房产变更订阅