清空input框内容遇到的小问题--------(记录自勉)

1,063 阅读1分钟

使用$watchGroup监听ng-model的变化清空input值,本来以为很简单的事情结构卡壳了,提醒自己!!!!!!!!!!!!!!

<div ng-app="myApp" ng-controller="myCtrl">
    {{data.ff}}: <input type="number" ng-model="data.ff"><br> 
    {{data.gg}}: <input type="number" ng-model="data.gg"><br>
    <br> 
</div>
<script>
    var app = angular.module('myApp', []);
    app.controller('myCtrl', function ($scope) {
        $scope.data = {
            ff: 100,
            gg: 0
        }
        $scope.$watchGroup(['data.ff', 'data.gg'], function (n, o) {
            $scope.data.ff=isNaN(n[0])?'':n[0]
            $scope.data.gg=isNaN(n[1])?'':n[1]
        })
    });
</script>

处理问题:input框数禁止输入e

1.添加代码

<input type='number'

onkeypress='return(/[\d]/.test(String.fromCharCode(event.keyCode) ) )' />

也可以将需求改为置零$scope.data.ff = isNaN(n[0]) ? 0 : n[0]

ps------number属性框将value设置为"" 时只能清空数字,输入的e无法清除,e在数学上代表2.71828,所以它也还是一个数字可以输入,但是却清不了,真是gg了 第一次发现这个问题记录一下加深印象

2.使用text框只显示数字

$scope.data.ff=isNaN(n[0])?'':n[0]

$scope.data.gg=isNaN(n[1])?'':n[1]