Question

我正在努力让AngularJS能够正常使用我想要实现的小东西。

我有一个number类型的输入（可能导致问题），它被绑定到我的控制器中的变量，如果此输入为空，我需要禁用一个按钮。

这是我输入和按钮的代码：

<input type="number" min="0" max="20" ng-model="student.mark">

<button ng-disabled="!student">Send</button>

如果字段为空，我尝试了几种解决方案来禁用我的按钮，但如果它的值为0，则启用它：

<button ng-disabled="!student || !student.mark">Send</button>

<button ng-disabled="!student || !angular.isNumber(student.mark)">Send</button>

<button ng-disabled="!student || student.mark == ''">Send</button>

<button ng-disabled="!student || student.mark === ''">Send</button>

这些似乎都不起作用。如果我的输入中有任何数字，它将正常工作，但是如果我有值＆＃34; 0＆＃34;则该按钮将被禁用，或者如果我输入有效值然后将其删除则该按钮将保持启用状态

是什么让我认为它应该有用的事实是，如果我使用{{ student.mark }}显示值，则值0将确实显示为＆＃34; 0＆＃34;并且空输入将显示为空。

感谢。

Answer 1

注意：0被视为假。

在你的控制器中定义

 $scope.student.mark = null;

使用条件

 ng-disabled="student.mark == null && student.mark < 0"

Answer 2

我建议你使用表格，就像那样：

<form name="formName" ng-submit="someMethod(student)" autocomplete="off" 
novalidate>

<input type="number" min="0" max="20"
    ng-model="student.mark" placeholder="e.g. 12"
    ng-required="true" /> 
<button type="submit" value="Send" ng-disabled="formName.$invalid || <something else here>" />
</form>

Answer 3

我尝试了更多的东西，并且实际测试值null是否有效：

<button ng-disabled="!student || student.mark === null">Send</button>

AngularJS - 检查输入类型＆＃34;数字＆＃34;有一个值，0是一个有效值

3 个答案: