[解決済み] Angular2でonBlurイベントを使用するには?
2022-06-18 06:52:58
質問
Angular2でonBlurイベントを検出する方法を教えてください。 私はそれを使用したい
<input type="text">
どなたか使い方を教えてください。
どのように解決するのですか?
使用方法
(eventName)
を使うことで、基本的に
()
はイベントバインディングのために使用されます。また
ngModel
の双方向のバインディングを得るには
myModel
変数への双方向のバインディングを得ることができます。
マークアップ
<input type="text" [(ngModel)]="myModel" (blur)="onBlurMethod()">
コード
export class AppComponent {
myModel: any;
constructor(){
this.myModel = '123';
}
onBlurMethod(){
alert(this.myModel)
}
}
代替案(好ましくない)
<input type="text" #input (blur)="onBlurMethod($event.target.value)">
モデル駆動型フォームでバリデーションを行うには
blur
に対してバリデーションを行うには
updateOn
パラメータを渡すことができます。
ctrl = new FormControl('', {
updateOn: 'blur', //default will be change
validators: [Validators.required]
});
関連
-
[解決済み】Node.js Error: Cannot find module express
-
[解決済み] 配列から特定の項目を削除するにはどうすればよいですか?
-
[解決済み] jQueryで要素が非表示になっているかどうかを確認するには?
-
[解決済み] JavaScriptで "use strict "は何をするのか、その根拠は?
-
[解決済み] event.preventDefault() vs. return false
-
[解決済み] JavaScriptで文字列をbooleanに変換するにはどうしたらいいですか?
-
[解決済み] どのラジオボタンが選択されているかをjQueryで知るにはどうしたらよいですか?
-
[解決済み] Node.jsを使うタイミングをどう判断するか?
-
[解決済み] 動的に生成された要素にイベントバインディングを行うか?
-
[解決済み】別のウェブページにリダイレクトするにはどうすればいいですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
親子コンポーネント通信を解決する3つのVueスロット
-
jsを使った簡単な照明スイッチのコード
-
JavaScriptの配列共通メソッド解説
-
vueの補間表現とv-textディレクティブの違いについて
-
Vueのフォームイベントのデータバインディングの説明
-
[解決済み】Node Version Manager のインストール - nvm コマンドが見つかりません。
-
[解決済み】GETできない / Nodejsエラー
-
[解決済み】JavaScriptエラー(Uncaught SyntaxError: Unexpected end of input)
-
[解決済み】<select>で現在選択されている<option>をJavaScriptで取得するにはどうすればよいですか?
-
JavaScriptのgetElementById()メソッド入門