当必填字段为空时使用 ng-disable答案

【问题标题】：Work with ng-disable when required field is empty当必填字段为空时使用 ng-disable
【发布时间】：2017-03-29 16:00:39
【问题描述】：

我在让ng-disable 工作时遇到了一些问题，所以，我有这个 div：

<div>
  <p>{{ message }}</p>
  <div >
     <input type="number" id="field1" placeholder="field 1" ng-model="field1" min="0" required>
     <input type="date" id="field2"  ng-model="field2">
  </div>
  <button ng-disabled="field1.$valid" ng-click="submit()">OK</button>
</div>

我想验证 如果 field1 为空（未填充）我想禁用按钮，所以，用户无法点击它。

我该怎么做？
我尝试了一些方法，但有人为我工作。

【问题讨论】：

使用ng-disabled="!field1.trim().length"
@SudharsanSelvaraj 当然可以，但是，如果我为该字段添加了一个值，则该按钮无法单击
看看我的回答@PedroHenrique

标签： javascript angularjs forms angularjs-scope

【解决方案1】：

您的 HTML 代码应该包含在 form 中。点击Run code snippet 看看它的工作原理。

function ApplicationController($scope) {     
    $scope.message = "Hola Pedro Henrique!";
    $scope.submit = function(){
        console.log($scope.field1);
    };
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<form ng-app ng-controller="ApplicationController" role="form" name="form1" novalidate>
    <p>{{ message }}</p>
    <div>
        <input type="number" id="field1" placeholder="field 1" ng-model="field1" min="0" required>
        <input type="date" id="field2"  ng-model="field2">
    </div>
    <button type="submit" ng-disabled="form1.$invalid" ng-click="submit()">OK</button>
</form>

【讨论】：