Two-Way ràng buộc trong một Aurelia Custom Attribute

Question

UPDATE: Dường như đây là một lỗi được biết: https://github.com/aurelia/templating/issues/253
Tôi rời khỏi nó vào đây để mục đích tham khảo/khả năng tìm kiếm.

Bộ luật:

đầu vào-mask.ts (Full mã có thể được nhìn thấy 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"/> 

CẬP NHẬT: Để khắc phục lỗi này, hãy đổi thành unmasked-value.two-way và tính năng liên kết sẽ hoạt động.

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!'); 
} 

Vấn đề:

Các dữ liệu dường như chảy vào @bindable biến tốt. Khi mặt nạ thay đổi, giá trị trong thuộc tính tùy chỉnh được thay đổi.

Nhưng dường như nó không chảy ra nếu có thay đổi bên trong thuộc tính tùy chỉnh.

Ví dụ Kịch bản: Sau khi tôi chỉnh sửa giá trị trong hộp đầu vào, và thoát khỏi đầu vào, các focusout cháy sự kiện và báo cáo kết quả giao diện điều khiển chỉ ra rằng giá trị lột mặt nạ đã được cập nhật từ bên trong tùy chỉnh thuộc tính in:

unmaskedValue cập nhật từ bên trong tùy chỉnh thuộc tính

Nhưng (khi đầu vào thua tập trung) báo cáo kết quả giao diện điều khiển nói rằng airbill vào file carrier.ts đã được cập nhật không cháy, khi tôi thoát khỏi hộp nhập liệu:

này không cháy:
console.log ('! Airbill được thành lập');

Điều này dường như cho thấy rằng ràng buộc không thực sự là hai chiều.

Các Câu hỏi:

Làm thế nào tôi có thể làm cho điều này ràng buộc hai chiều? Vì vậy, khi tôi cập nhật unmaskedValue bên trong thuộc tính tùy chỉnh, nó sẽ cập nhật giá trị bị ràng buộc trong mô hình khung nhìn?

Lưu ý: Để giải quyết sự cố, tôi có thể thay đổi unmasked-value.bind thành cuộc gọi phương thức (on-unmasked-value-changed.call="onUnmaskedValueChanged($event)) và cập nhật giá trị trong phương thức đó. Vì vậy, tôi không CẦN này để làm việc.Nhưng tôi muốn biết liệu có thể sử dụng trong tương lai hay không.

Answer 1

Cố gắng khởi tạo biến unmaskedValue với giá trị mặc định. Hãy thử null, undefined, '' và cứ thế. Tôi đã làm điều này trước đây nhưng tôi don `t nhớ, trong đó phiên bản (chắc chắn nó là beta)

Answer 2

lỗi được biết đến này đã được cố định và đóng cửa vào ngày 15 tháng ba năm 2016 https://github.com/aurelia/templating/issues/253#issuecomment-189394955