Javascript 通过AngularJS在Firefox中处理数字输入

我在Firefox中遇到了一个奇怪的问题，希望有人能给我解释一下。我有一个AngularJS控制器，其方法与表单中各种输入控件上的

ng change

相关联，包括标记为

number

输入的控件。此方法的逻辑是，如果任何一个绑定范围变量设置正确，则将另一个范围变量设置为true。这基本上是一种表单验证的尝试，其中需要任何一个（或多个）输入

例如：

app.controller('test', function($scope) {
  $scope.num = 0;
  $scope.name = "";
  $scope.valid = false;

  $scope.inputChange = function() {
    console.log('Input changed');
    $scope.valid = ($scope.num > 0) || ($scope.name.length > 0);
  }
});

及表格：

<form name="numberTest" ng-app="myApp" ng-controller="test">
      <input ng-model="name" name="name" type="text" ng-change="inputChange()"/>
      <input type="number" ng-model="num" name="n" id="n" ng-change="inputChange()"/>
      <input type="button" value="Go" ng-disabled="!valid"/>
</form>

这一切在Chrome中都可以正常工作，但在Firefox中，当在数字输入中输入非数字文本时，会触发此

ng change

处理程序，而文本框本身也会在其中获取这些虚假数据，尽管模型没有更新。这会导致一种混乱的状态，即num文本框中存在无效数据，该数据未绑定到AngularJS模型，但用户可以单击该按钮。Chrome不会出现这个问题，因为它不会在输入控件中呈现非数字数据

我如何检测（和处理）这种情况？输入控件正在显示无效且未绑定到绑定模型的文本

我当然愿意使用其他实现来实现同样的效果。AngularJS版本是1.3.0

---

在Firefox中运行以查看“坏”行为的示例我最终发现了这些数字输入的属性，这似乎满足了我的需要：

• 如果为空，则返回true
• 如果控件中有非数字数据，则返回false

因此，我的更新按钮：

<input type="button" value="Go" ng-disabled="!valid || !numberTest.n.$valid"/>