Question

通常情况下，当我想订阅变量时，我只是声明变量并声明一个带有变量名的函数，后跟单词＆＃39; Changed＆＃39;在功能结束时如下：

test = '';

testChanged() {
// do stuff here
}

Aurelia提供了一种非常好的处理方法。但是，如果我想在不使用bindingEngine.propertyObserver

的情况下订阅对象内的属性，该怎么办？

例如：

model = {
  a: '',
  b: ''
}

如何使用与上述相同的约定订阅model.a？

Answer 1

您将需要使用Object.defineProperty方法来查看对象特定的更改属性。我相信这是Aurelia protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack && Request.QueryString["B1"] != null) { CheckBox1.Checked = true; } }和@bindable方法在大多数情况下在幕后工作的方式。

@observable

值得一提的第一件事就是在setter方法Object.defineProperty(this.model, 'a', { configurable: true, enumerable: true, get: () => { return this.model.__a; }, set: (v) => { this.model.__a = v; this.modelChanged(v); } });里面你不能设置原始值，否则会触发一个递归循环并抛出一个堆栈错误，所以你将值赋值为double下划线加前缀名称，类似于临时隐藏变量。

然后在我们的类中定义我们的回调函数：

set

最后，将它们组合在一起并使用setTimeout进行测试：

modelChanged(value) {
    console.log(value);
}

说完所有这些之后，值得注意的是export class MyViewModel { model = { a: '', b: '' }; constructor() { Object.defineProperty(this.model, 'a', { configurable: true, enumerable: true, get: () => { return this.model.__a; }, set: (v) => { this.model.__a = v; this.modelChanged(v); } }); setTimeout(() => { this.model.a = 'HELLO!'; }, 3000); } modelChanged(value) { console.log(value); // After 3 seconds, this should be "HELLO!" in the browser console. } }功能基本上在引擎盖下做同样的事情。老实说，我会考虑使用bindingEngine.propertyObserver而不是在您的应用中引入一堆代码行来观看属性。

Aurelia绑定，将函数绑定到对象的属性，而不使用propertyObserver

1 个答案: