@HostListener('keydown', ['$event', '$event.keyCode'])
onKeyDown($event: KeyboardEvent, keyCode) { if(keyCode !== TAB) {
$event.preventDefault();
} // get value for the key
const val = String.fromCharCode(keyCode);
// get position
const cursorPos = this.input.selectionStart; overWriteCharAtPosition(this.input, val, cursorPos);
} export const overWriteCharAtPosition = (
input: HTMLInputElement,
val: any,
position: number
) => {
const currentValue = input.value;
input.value = currentValue.slice(, position) + val + currentValue.slice(position+);
};

[Angular HTML] Overwrite input value, String.fromCharCode & input.selectionStart的更多相关文章

  1. Android input输入框 移动页面input手机键盘中的“搜索”按键

    动页面input手机键盘中的“搜索”按键 满足以下几点机即可: input type="search"    放到form标签中    使用action属性 <form ac ...

  2. 封装input 逐渐,且input插件必须带有默认值。

    封装input 逐渐,且input插件必须带有默认值. 组件: <template> <div class="input-show"> <span c ...

  3. 数组乘积--满足result[i] = input数组中除了input[i]之外所有数的乘积(假设不会溢出

    数组乘积(15分) 输入:一个长度为n的整数数组input 输出:一个长度为n的整数数组result,满足result[i] = input数组中除了input[i]之外所有数的乘积(假设不会溢出). ...

  4. Oracle delete input与delete all input

    oracle官方文档提示:If you had specified DELETE INPUT rather than DELETE ALL INPUT, then RMAN would have on ...

  5. input type类型和input表单属性

    一.input type类型 1.Input 类型 - email 在提交表单时,会自动验证 email 域的值. E-mail: <input type="email" n ...

  6. 定制 input[type="radio"] 和 input[type="checkbox"] 样式

    表单中,经常会使用到单选按钮和复选框,但是,input[type="radio"] 和 input[type="checkbox"] 的默认样式在不同的浏览器或 ...

  7. 修改 input[type="radio"] 和 input[type="checkbox"] 的默认样式

    表单中,经常会使用到单选按钮和复选框,但是,input[type="radio"] 和 input[type="checkbox"] 的默认样式在不同的浏览器或 ...

  8. angular自定义指令解决IE89不支持input的placeholder属性

    下面代码实测通过,直接copy到本地运行即可. <!DOCTYPE html> <html> <head> <meta charset="UTF-8 ...

  9. How to Construct the Input Bet String

    The purpose of this section is to describe the format of the string which will submitted to the Pyth ...

随机推荐

  1. Tachyon的配置详解

    Tachyon的配置 Tachyon环境变量 Tachyon通用配置 TachyonMaster配置 TachyonWorker配置 用户配置 1 Tachyon的配置 这里以0.5.0版本为例,介绍 ...

  2. C# 爬虫总结

    static void Main(string[] args) { //WebRequest request = WebRequest.Create("http://www.cnblogs. ...

  3. Oracle定义变量、常量

    1 定义变量 declare var_countryname varchar2(50):='中国'; 2 定义常量 con_day constant integer:=365;

  4. 洛谷 P2437 蜜蜂路线

    P2437 蜜蜂路线 题目描述 一只蜜蜂在下图所示的数字蜂房上爬动,已知它只能从标号小的蜂房爬到标号大的相邻蜂房,现在问你:蜜蜂从蜂房M开始爬到蜂房N,M<N,有多少种爬行路线? 输入输出格式 ...

  5. golang 数组

    数组是Go语言编程中最常用的数据结构之一.顾名思义,数组就是指一系列同一类型数据的集合.数组中包含的每个数据被称为数组元素(element),一个数组包含的元素个数被称为数组的长度. 在Go语言中数组 ...

  6. launcher- 第三方应用图标替换

    有时候我们感觉第三方应用的icon不美观,或者跟我们主题风格不一致,这时候我们希望换成我们想要的icon,那我们可以这么做(以更换QQ应用icon为例): 1.首先我们当然要根据自己的需要做一张替换i ...

  7. eclipse- 智能提示设置

    最近自己ubuntu 下的eclipse没办法只能提示了.后来在网上查了方法,完美解决了问题 1.java代码编辑的时候不提示 具体如下 Windows→Preferences→Java→Editor ...

  8. c++运算符重载笔记

    运算符重载的概念:给原有的运算符赋予新的功能: 比如:+ 不仅可以做算术运算也可以连接俩个字符串 一元运算符:只与一个操作数进行运算 比如 正负号 运算符重载的本质是:函数重载. <<与& ...

  9. Codefroces 760 B. Frodo and pillows

    B. Frodo and pillows time limit per test 1 second memory limit per test 256 megabytes input standard ...

  10. vue踩坑记-在项目中安装依赖模块npm install报错

    在维护别人的项目的时候,在项目文件夹中安装npm install模块的时候,报错如下: npm ERR! path D:\ShopApp\node_modules\fsevents\node_modu ...