2016-02-26 59 views
8

UPDATE:它看起來這是一個已知的bug:https://github.com/aurelia/templating/issues/253
我離開這裏以供參考/可搜索的目的。雙向在奧裏利亞自定義綁定屬性

的代碼:

輸入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"/> 

更新:要解決此錯誤,請更改爲unmasked-value.two-way,並且綁定將起作用。

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變量就好了。隨着蒙版更改,自定義屬性中的值將更改。

但是,如果在自定義屬性中進行更改,它似乎不會流出。

示例場景: 我編輯輸入框中的值之後,並退出輸入時,focusout事件觸發,並且表明未屏蔽值從自定義打印內部屬性更新控制檯聲明:

unmaskedValue從自定義內更新的屬性

但(當輸入失去焦點)控制檯聲明稱,airbill上carrier.ts文件進行了更新,當我退出輸入框不火:

這不火:
的console.log(「!空運單設置」);

這似乎向我顯示綁定不是真正的雙向。

問題:

我怎樣才能使這種結合雙向?因此,當我更新unmaskedValue內部的自定義屬性時,它將更新視圖模型中的界限值?

注意:作爲解決方法,我可以將unmasked-value.bind更改爲方法調用(on-unmasked-value-changed.call="onUnmaskedValueChanged($event))並更新該方法中的值。所以我不需要這個工作。但我想知道是否有可能用於未來。

+0

看起來這是一個已知的bug: https://github.com/aurelia/templating/issues/253 – Vaccano

+0

將HTML中的綁定更改爲'.two-way'(而不是'.bind')可以解決此問題。 – Vaccano

+1

看起來這個問題已關閉,您是否可以按照您現在的方式使用它,而無需解決方法? –

回答

-1

嘗試用默認值初始化變量unmaskedValue。嘗試null,undefined,等等。我以前做過,但我不`噸記得在哪個版本(當然這是測試版)