輸入值轉換器覆蓋change.trigger事件

Question

我有一個輸入字段，接受10個連續的數字，一旦輸入最後一位數字，將數字格式化爲xxx-xxx-xxxx格式的電話號碼。 IT也允許用戶以所提及的格式和10位數序列輸入數字。

我還有一個彈出窗口，一旦用戶更改值（在這種情況下，如果該值與用戶選項卡/單擊字段時不同）。由於我添加了值轉換器，只要數字格式化爲第10位數字，更改事件就不會再觸發了。奇怪的是，如果用戶以最終最終輸入的格式輸入數字，事件將按預期觸發。

電話format.js

export class PhoneNumberValueConverter { 
    toView(value) { 
    return value.replace(/(\d{3})(\d{3})(\d{4})/, '$1-$2-$3'); 
    } 
} 

輸入字段

<input id="phNumber" value.bind="phone | phoneFormat" change.trigger="showModal();"></input> 

的ShowModal（）;

showModal() { 
     if(this.hasChanged && this.yesRadio){ 
      $('#updateModal').modal(); 
     } 
    } 

是價值變換器觸發change事件，多數民衆贊成在球場上的優先級比我自己？

Answer 1

根據MDN的說法，change事件應該在輸入元素在其值更改後失去焦點時觸發。

當輸入第10位數字時，您的值轉換器格式化該值，導致綁定系統將格式化值應用於輸入。因爲在輸入失去焦點之前發生的最後一件事是以編程方式設置的值（vs通過用戶輸入），因此不符合觸發change事件的條件。

嘗試使用blur事件，因爲您的更改處理程序已在檢查值是否已更改。