节目 ？在文本框中，当文本框具有用于数字验证的ng-pattern时

Question

我需要展示'？'当无法从扫描仪读取的值时，通过包含'？'

返回值

假设文件的sr不是'123'，但是由于某种原因，扫描仪无法读取它然后将它返回为“12”？要么 ”？？？”或“？23”或“1？3”

如果任何不可读的数字需要由用户手动更正，我需要将其显示在文本框中。

在我们的应用程序中，我们使用的是angularjs验证，它不允许我在文本框中显示上面的值，因为它包含'？'这不是数值。

此外，我应该强制执行数字验证，以便用户可以更正上述内容并提交给服务器。

那么我们如何实现这一功能呢？

<div ng-app ng-controller="formCtrl">
<form name="myForm" ng-submit="onSubmit()">
<input type="text" ng-model="price" name="price_field" ng-pattern="/^[0-9]{1,7}$/" required>
<span ng-show="myForm.price_field.$error.pattern">Not a valid number!</span>
<input ng-show="toggle" type="submit" value="submit"/>
<input ng-show="!toggle" type="button" ng-click="AfterProcessing()"  value="After Processing"/> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <input type="button" value="Reset" ng-click="reset()"/>
    <br/>
<span>Activity : {{message}}</span>
</form>
</div>

JS代码

function formCtrl($scope){
    $scope.price= "123";
$scope.toggle = false;
$scope.message="No Activity";
$scope.onSubmit = function(){
    $scope.toggle=false;
    $scope.message="onSubmit clicked...";
}
$scope.AfterProcessing = function(){
    $scope.toggle=true;
    $scope.price ="1?3";
    $scope.message="AfterProcessing clicked...";
}
$scope.reset=function()
{
    $scope.toggle=false;
    $scope.price ="123";
    $scope.message="Reset clicked...";
    }
 }

我已经创建了如下示例。

检查JsFiddle sample

-Thanks

Answer 1

您需要创建一个将应用于文本框的CSS类。使用：before和：之后的伪css构造，你可以添加吗？性格并获得理想的结果。

所以， 1.根据您的要求，使用：before和/或：after定义CSS类 2.在HTML上，使用ng-class =“{'your-class'：$ error，'regular-class'：'$ pristine'}”

如果您需要代码示例和plunker，请告诉我。 （我现在结束了。明天可能会提供一些代码。）

如果您可以根据上述内容创建一个plnkr并在此处提交链接，那么更多人将能够为您提供帮助。感谢。