Question

我确实有一个输入字段，其中填充了 JSON 对象数据。

py manage.py runserver

输入看起来像这样：

 dimension: {
   length: 10.00,
   width: 20.00,
   height: 30.00,
 }

其中尺寸以打字稿代码的形式构建：

 <input matInput [placeholder]="Dimension (LxHxW)" formControlName="dimensions" 
        name="dimensions" mask="00.0x00.0x00.0" [specialCharacters]="['x', '.']" 
        [clearIfNotMatch]="true" [showMaskTyped]="true"
  />

目标是正确映射蒙版上的数据并获取长度，宽度和高度之间用x连接-> 获得柔性口罩。

尺寸值不同长度时出现问题：

例如如果尺寸为2.3 x 12.3 x 42.2而不是2.3 x 12.3 x 42.2，它将显示23.1 x 23.4 x22。（x偏移）。

你们能找到任何解决方案吗？

Answer 1

我猜你必须使用模式

以下示例取自this article on CSS-tricks, by Chris Coyier但created by Estelle Weyl，展示了如何使用A1A 1A1格式处理加拿大邮政编码：

 <div>
   <label for="czc">Canadian Zip Code</label>
   <input id="czc" placeholder="XXX XXX" pattern="\w\d\w \d\w\d" class="masked" 
       data-charset="_X_ X_X" id="zipca" type="text" name="zipcodeca" 
       title="6-character alphanumeric zip code in the format of A1A 1A1" />
 </div>

在这种情况下，您只应更改模式正则表达式。

Answer 2

“ angular2-text-mask” NPM库非常适合我。

https://www.npmjs.com/package/angular2-text-mask 让我知道您是否需要任何帮助。

谢谢。

自定义角度输入蒙版

2 个答案: