エンターキーを離すと、次のように機能します。に加えて、他にどのようなオプションがありますか?keyup
keyup.enter
<input #inputstring (keyup.enter)="doSomething(inputstring.value)"/>
エンターキーを離すと、次のように機能します。に加えて、他にどのようなオプションがありますか?keyup
keyup.enter
<input #inputstring (keyup.enter)="doSomething(inputstring.value)"/>
回答:
これらは、現在テストで文書化されているオプションです:ctrl、shift、enter、escape。これらは、キーバインディングのいくつかの有効な例です。
keydown.control.shift.enter
keydown.control.esc
公式のドキュメントが存在しない間、ここでこれを追跡できますが、すぐに公開されるはずです。
複数の主要なイベント(具体的にはShift + Enter)にバインドする方法を探していましたが、オンラインで適切なリソースを見つけることができませんでした。しかし、キーダウンバインディングをログに記録した後
<textarea (keydown)=onKeydownEvent($event)></textarea>
キーボードイベントが、Shift + Enterを検出するために必要なすべての情報を提供することを発見しました。$event
かなり詳細なKeyboardEventを返すことがわかりました。
onKeydownEvent(event: KeyboardEvent): void {
if (event.keyCode === 13 && event.shiftKey) {
// On 'Shift+Enter' do this...
}
}
CtrlKey、AltKey、およびMetaKey(Macの場合はコマンドキー)のフラグもあります。
KeyEventsPlugin、JQuery、または純粋なJSバインディングは必要ありません。
このファイルには、さらにいくつかのヒントがあります。たとえば、keydown.upが機能しない場合は、keydown.arrowupが必要です。
今日も同じ問題にぶつかりました。
これらは十分に文書化されておらず、未解決の問題が存在します。
スペースのようなキーアップ用のもの:
<input (keyup.space)="doSomething()">
<input (keyup.spacebar)="doSomething()">
キーダウン用の一部
(キーアップでも機能する場合があります):
<input (keydown.enter)="...">
<input (keydown.a)="...">
<input (keydown.esc)="...">
<input (keydown.alt)="...">
<input (keydown.shift.esc)="...">
<input (keydown.shift.arrowdown)="...">
<input (keydown.f4)="...">
上記はすべて以下のリンクからのものです:
https://github.com/angular/angular/issues/18870
https://github.com/angular/angular/issues/8273
https://github.com/angular/angular/blob/master/packages/platform- browser / src / dom / events / key_events.ts
https://alligator.io/angular/binding-keyup-keydown-events/
このようなキーアップイベントを追加できます
template: `
<input (keyup)="onKey($event)">
<p>{{values}}</p>
`
コンポーネントで、以下のようなコードを作成します
export class KeyUpComponent_v1 {
values = '';
onKey(event:any) { // without type info
this.values += event.target.value + ' | ';
}
}
あなたからkeyupイベントが外にある場合CTRL、SHIFT、ENTERおよびESCブラケット、ちょうど@MdアユブアリSarkerのガイドを使用。ここでAngularドキュメントhttps://angular.io/docs/ts/latest/guide/user-input.htmlに記載されている唯一のキーアップ疑似イベントがENTERキーです。数字キーとアルファベットのキーアップ疑似イベントはまだありません。
でプロパティをkeyCode
使用できるのは非推奨ですkey
KeyboardEvent
<textarea (keydown)=onKeydownEvent($event)></textarea>
Typescript:
onKeydownEvent($event: KeyboardEvent){
// you can use the following for checkig enter key pressed or not
if ($event.key === 'Enter') {
console.log($event.key); // Enter
}
if ($event.key === 'Enter' && event.shiftKey) {
//This is 'Shift+Enter'
}
}