如何更新Aurelia中的可观测值

Question

我正在将一个项目从Durandal转换为Aurelia，之前我曾使用可观察值将输入的长度限制为1(以及输入的最后一位数字(

这就是我所拥有的：

HTML

<input autocomplete="off" type="number" class="otp" maxlength=1 id="otpa" value.bind="otpa.value" />

JavaScript:

'use-strict';
import { Router } from 'aurelia-router';
import { inject, BindingEngine } from 'aurelia-framework';
@inject(Router, BindingEngine)
export class Register {
otpa = {
value: '',
hasFocus: false
};
constructor(router, bindingEngine) {
this.router = router;
this.bindingEngine = bindingEngine;
}
activate = () => {
this.subscriptions = this.bindingEngine
.propertyObserver(this.otpa, 'value')
.subscribe(this.otpaValueChanged);
return true;
};
deactivate = () => {
this.subscriptions.dispose();
return true;
};
otpaValueChanged(newValue, oldValue) {
if (newValue.length > 1) {
this.otpa.value = newValue.substring(newValue.length - 1, newValue.length);
}
}
}

otpaValueChanged函数在输入更改时激发，但是当长度>1我得到错误"；无法读取未定义的"的属性"opta"；。

我意识到"；这个"；是未定义的，但我不确定的是如何在该函数中访问opta？

或者，还有其他方法可以解决这个问题吗？

提前感谢！

Answer 1

您可能需要将您的订阅绑定到以下内容：

activate = () => {
this.subscriptions = this.bindingEngine
.propertyObserver(this.otpa, 'value')
.subscribe(this.otpaValueChanged.bind(this));
return true;
};