繁体   English   中英

Aurelia自定义属性中的双向绑定

[英]Two-Way binding in an Aurelia Custom Attribute

更新:看起来这是一个已知的错误: https//github.com/aurelia/template/issues/253
我将其留在此处以供参考/可搜索性目的。

代码:

input-mask.ts (完整的代码可以在这里看到)

@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"/>

更新:要变通解决此错误,更改为unmasked-value.two-way ,绑定将起作用。

载体

@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变量。 随着蒙版的更改,自定义属性中的值也会更改。

但是,如果在自定义属性内进行更改,它似乎不会消失。

示例场景:在输入框中编辑值并退出输入后,将触发focusout事件,并显示控制台语句,该语句指示从自定义属性内部更新了未屏蔽的Value:

unmaskedValue从自定义属性内部更新

但是(当输入失去焦点时)控制台语句说,当我退出输入框时, airbill文件上的airbill已更新不会触发:

这不会触发:
console.log('Airbill已设置!');

这似乎向我表明,绑定实际上不是双向的。

问题:

我该如何进行双向绑定? 这样,当我在自定义属性内更新unmaskedValue时,它将更新视图模型中的绑定值吗?

注意:作为一种解决方法,我可以将unmasked-value.bind更改为方法调用( on-unmasked-value-changed.call="onUnmaskedValueChanged($event) )并更新该方法中的值。所以我不t需要此功能,但我想知道将来是否可以使用。

此已知错误已于2016年3月15日修复并关闭https://github.com/aurelia/templating/issues/253#issuecomment-189394955

尝试使用默认值初始化变量unmaskedValue。 尝试null,undefined,''等。 我以前做过,但是我不记得是哪个版本(肯定是beta版)

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM