即使日期有效，md-datepicker 也会显示红色下划线答案

【问题标题】：md-datepicker shows up red underline even though the date is valid即使日期有效，md-datepicker 也会显示红色下划线
【发布时间】：2016-01-12 12:21:08
【问题描述】：

<md-datepicker name="startDate"  md-is-error="data.isInvalid(Form.startDate)" ng-model="data.startDate" md-placeholder="Start date" required flex="100" flex-lg="50"></md-datepicker>
<div ng-messages="Form.startDate.$error" ng-if="data.isInvalid(Form.startDate)">
    <div ng-message="valid">The entered value is not a date!</div>
    <div ng-message="required">This date is required!</div>
    <div ng-message="mindate">Date is too early!</div>
    <div ng-message="maxdate">Date is too late!</div>
</div>


isInvalid : function(formObject) {
    return formObject.$invalid && (formObject.$$parentForm.$submitted || formObject.$touched || formObject.$dirty);
}

我正在使用 md-datepicker。当我使用模型填充数据时，我在 datepicker 输入框下方看到一条红线。日期是有效的，但我不知道为什么会这样。请参阅随附的屏幕截图以获取更多参考。有人遇到过这个问题吗？非常感谢您的建议。

【问题讨论】：

我们可以有一个plnkr吗？
用 md-input-container 包裹日期选择器。

标签： angularjs validation datepicker angular-material

【解决方案1】：

首先检查你的模块中是否注入了 ngMessages，第二个 ng-messages 需要一个表单（在你的情况下，我的 sn-p 'myForm' 中名为 'Form'），最后你必须检查你的 ng-model 是否有一个控制器或您拥有数据的东西。您还需要一个有效的 md-is-error 表单。

对不起，我的英语水平我无法正确解释你的错误，但你可以检查我的 sn-p。

<html>

    <head>
      <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/1.0.0/angular-material.min.css">
      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular-messages.min.js"></script>
      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-animate.js"></script>
      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-aria.js"></script>
      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-sanitize.js"></script>
      <script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.0.0/angular-material.min.js"></script>
  

    <style type="text/css">
    .validation-messages {
        font-size: 11px;
        color: darkred;
        margin: 10px 0 0 25px; }
    </style>
    </head>

    <body ng-app="testApp" ng-controller="AppCtrl">
<form name="myForm">
    <md-datepicker name="startDate"  md-is-error="myForm.startDate.$invalid && myForm.$submitted" ng-model="startDate" md-placeholder="Start date" required flex="100" flex-lg="50"></md-datepicker>
    <div class="validation-messages" ng-messages="myForm.startDate.$error">
        <div ng-message="valid">The entered value is not a date!</div>
        <div ng-message="required">This date is required!</div>
        <div ng-message="mindate">Date is too early!</div>
        <div ng-message="maxdate">Date is too late!</div>
    </div>
</form>
     <script type="text/javascript">
            var app = angular.module("testApp", ["ngMaterial","ngMessages"])
                             .controller('AppCtrl', function($scope) {
                                  $scope.startDate= null;         //no date on page load                    });
      </script>
    </body>

    </html>

【讨论】：

这段代码对我不起作用..我不知道我错过了什么
你真的需要一个表单来访问 md-datepicker 的错误吗？我使用 ng-change 直接在控制器中使用我的值，我真的不需要一个表单。