入力ボックスが1つあります。私はそれにいくつかの価値を示しています。その入力ボックスを読み取り専用にしたい。ただし、矢印キー、ホームキー、終了キー、これらのキーは機能するはずです。
複数のURLをカンマ区切りで表示しています。これらのURL間を移動したいと思います。そのため、上記のキーが機能する必要があります。
で試しましたが[readonly]="true"、入力ボックス内を移動できません。私も使えませんdisabled。
<input matInput placeholder="Enter Promotional Link URL" [(ngModel)]="lms.LmPromotionalUrl" name="LmPromotionalUrl">
出力
www.facebook.com,www.google.com,www.cisco.com
この動作を実現する方法はありますか？
これがプレーンなJavaScriptのソリューションです(keydown)。これをHostListenerまたはAngularに簡単に適合させることができます。基本的にはfalseを返し、矢印キー以外のキーのデフォルトの動作を防ぎます（Macを使用していて、どのホームキーかわからないので、ここで確認して、allowedの配列に追加できます）キーコード
document.getElementById('foo').addEventListener('keydown', e => {
if (![37, 38, 39, 40].includes(e.keyCode)) {
e.preventDefault();
return false;
}
})<input id="foo" placeholder="Enter Promotional Link URL" name="LmPromotionalUrl" value="foo">この例では、矢印キーを使用して値を「ナビゲート」することはできますが、何も入力または削除することはできません。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加