javascript 使用 Aurelia 订阅属性更改
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/28419242/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Property change subscription with Aurelia
提问by Matthew James Davis
I have a property on my viewmodel which I want to listen to and trigger events based on its value, like this:
我的视图模型上有一个属性，我想根据其值侦听和触发事件，如下所示：
class viewModel {
constructor() {
this.value = '0';
let val = 2;
subscribe(this.value, callbackForValue);
subscribe(val, callbackForVal);
}
}
Is this a feature of Aurelia? If so, how would I go about setting up such a subscription?
这是Aurelia的特征吗？如果是这样，我将如何设置这样的订阅？
回答by Jeremy Danyow
In some plugins I've been using DI to get the ObserverLocatorinstance from the container:
在一些插件中，我一直使用 DIObserverLocator从容器中获取实例：
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;
}
...
}
You can then do something like this:
然后你可以做这样的事情：
var subscription = this.observerLocator
.getObserver(myObj, 'myPropertyName')
.subscribe(myCallback);
When you're ready to dispose of the subscription, invoke it:
当您准备好处理订阅时，调用它：
subscription();
I think this is all subject to change but it's something you could use right now if you needed to.
我认为这一切都可能发生变化，但如果需要，您现在可以使用它。
More info here
更多信息在这里
October 2015 update
2015 年 10 月更新
The ObserverLocator is Aurelia's internal "bare metal" API. There's now a public API for the binding engine that could be used:
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();
}
}
回答by sharky101
The observable attribute has less of an overhead to binding according to I kill nerds.
根据I kill nerds， observable 属性对绑定的开销较小 。
import {observable} from "aurelia-framework";
export class Example {
@observable
public description: string;
private descriptionChanged(newValue: string, oldValue: string): void {
}
}
回答by Mars Robertson
listen to and trigger events based on its value
根据其值侦听和触发事件
A snippet from code using TypeScript, hopefully that will get you an idea:
使用 TypeScript 的代码片段，希望能让您有所了解：
import {bindingMode} from "aurelia-binding";
export class Example{
@bindable
public description: string;
private descriptionChanged(newValue: string, oldValue: string): void {
console.log(newValue, oldValue);
}
}
Method name should follow convention `${propertyName}Changed`
方法名称应遵循约定 `${propertyName}Changed`
EDIT:That's exactly what Decade Moonsuggested in the comment above: Property change subscription with Aurelia
编辑：这正是Decade Moon在上面的评论中所建议的：Property change subscription with Aurelia
回答by Andrew
The @observabledecorator works fine for this scenario.
该@observable装饰工作正常，这种情况下。
You could use the BindingEngineto watch a collection or control when to subscribe/unsubscribe
您可以使用BindingEngine来观看收藏或控制何时订阅/取消订阅
