UPDATE: It looks like this is a known bug: https://github.com/aurelia/templating/issues/253
I am leaving it here for reference / searchability purposes.
代码:
input-mask.ts(完整代码可见here)
@customAttribute('input-mask')
@inject(Element)
export class InputMaskCustomAttribute {
@bindable({ defaultBindingMode: bindingMode.twoWay,
changeHandler: 'onUnmaskedValueChanged' })
unmaskedValue: any;
onUnmaskedValueChanged(newValue, oldValue) {
console.log('unmaskedValue updated from inside the custom attribute');
}
@bindable
mask: string;
attached() {
this.eventTarget.on('focusout', (e: any) => {
this.unmaskedValue = (<any>$(this.element)).cleanVal()
this.fireEvent(e.target, 'input');
});
}
// Code for constructor, fireEvent and to setup the mask...
}
carrier.html
<input input-mask="mask.bind: carrier.airbillMask; unmasked-value.bind: airbill"
value.bind="formattedAirbill"/>
UPDATE: To work around this bug, change to
unmasked-value.two-way
and the binding will work.
carrier.ts
@bindable({ defaultBindingMode: bindingMode.twoWay})
carrier: EntityInterfaces.ICarrier;
@bindable({ defaultBindingMode: bindingMode.twoWay })
formattedAirbill: string;
@bindable({ defaultBindingMode: bindingMode.twoWay, changeHandler: 'onAirbillChanged' })
airbill: string;
onAirbillChanged() {
console.log('Airbill was set!');
}
问题:
数据似乎很好地流入了@bindable
变量。随着掩码的变化,自定义属性中的值也会发生变化。
但是如果在custom-attribute内部进行修改,似乎不会流出。
示例场景:
在我编辑输入框中的值并退出输入后,focusout
事件将触发,控制台语句指示未屏蔽的值已从自定义属性打印内部更新:
unmaskedValue updated from inside the custom attribute
但是(当输入失去焦点时)当我退出输入框时,控制台语句说 carrier.ts 文件上的 airbill
已更新不会触发:
This does not fire:
console.log('Airbill was set!');
这似乎向我表明绑定(bind)并不是真正的双向绑定(bind)。
问题:
我怎样才能实现双向绑定(bind)?这样当我更新自定义属性内的 unmaskedValue
时,它会更新 View 模型中的绑定(bind)值吗?
注意:作为解决方法,我能够将 unmasked-value.bind
更改为方法调用(on-unmasked-value-changed.call="onUnmaskedValueChanged($event)
) 并更新该方法中的值。所以我不需要它来工作。但我想知道将来是否可以使用它。
最佳答案
此已知错误已于 2016 年 3 月 15 日修复并关闭 https://github.com/aurelia/templating/issues/253#issuecomment-189394955
关于javascript - Aurelia 自定义属性中的双向绑定(bind),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35658280/