爲什麼Angular Keystrokes不能同步運行？或者我如何讓它們同步運行？

如何讓Angular 4/2按鍵事件同步運行？當我運行這個代碼時，鍵並不總是按照點火順序運行。爲什麼Angular Keystrokes不能同步運行？或者我如何讓它們同步運行？

模板

<div 
    contenteditable="true" 
    (keydown)="divKeyDown($event)" 
    (keyup)="divKeyUp($event)"> 
</div>

組件

divKeyDown(event) { 
    console.log('Keydown'); 
    // OFTEN GETS FIRED BEFORE KEYUP OF PREVIOUS STROKE 
} 
divKeyUp(event) { 
    console.log('Keyup'); 
}

來源

2017-08-09 Justin Levine

你需要像這樣的Plnkr嗎？ https://plnkr.co/edit/GYWY2HxFz41tmiXswFNs?p=preview（按下Ctrl鍵），檢查我是否使用@HostListener。 –

@JancoBoscan我看到與發佈的OP相同的問題（https://plnkr.co/edit/xN38ZlziYdqYI8qJsDDZ?p=preview）。 JustinLevine我認爲這個功能發生是因爲keyup＆keydown是獨立的事件流。所以我不知道是否有什麼可以做的。你想達到什麼目的？ – LLai

@LLai我相信這是因爲EventEmitter在後臺使用，但是在其構造函數中有一個isAsync切換。我想知道是否有可能通知它它不是異步的。在我的理解中，我控制了keydown上的輸入，然後重置keyup事件中的插入符號位置。如果它們不同步觸發，那麼當鍵盤事件被快速觸發時會被搞砸。 –

當鑰匙已經成爲名副其實起來並且沒有其他按鍵的關注KEYUP僅觸發。
按鍵將是一個更好的事件在這種情況下使用，因爲它總是在keydown後直接觸發，並且從未在另一個按鍵之前觸發。
這是默認行爲，不直接與Angular相關。

即使在香草JS，相同的行爲觀察：

document.getElementById('main').addEventListener('keydown', event => { 
    console.log('keydown'); // FIRED ONCE 
}); 
document.getElementById('main').addEventListener('keypress', event => { 
    console.log('keypress'); // FIRED AFTER KEYDOWN 
}); 
document.getElementById('main').addEventListener('keyup', event => { 
    console.log('keyup'); // FIRED WHEN THE KEY HAS LITERALLY BEEN RELEASED 
});

（在這種情況下我有「的keydown」後直接使用角的「ngAfterViewChecked」生命週期鉤來處理狀態的變化活動已完成）

來源

2017-08-10 22:38:41

爲什麼Angular Keystrokes不能同步運行？或者我如何讓它們同步運行？

回答

相關問題