javascript - Why does Angular ng-message 'when="required"' fire even though the input field has input? -

i have plunker here.

when type in input in input field , click elsewhere on page message "this field required." gets displayed. why message being displayed despite input field having value?

here code:

<form name="reportform" novalidate >   <input name="startdate" placeholder="enter start date" ng-model="startdatevalue" required>   <ng-messages ng-if='reportform.startdate.$touched' for="reportform.startdate.$error">     <ng-message when="required">       field required.     </ng-message>   </ng-messages>   <button ng-disabled="reportform.$invalid" type="submit">     submit query   </button> </form> 

you missing import ngmessages module:

example: https://plnkr.co/edit/vwhrtizrjkqbgfjaj5zb?p=preview

 var app = angular.module('plunker', ['ngmessages']);  app.controller('mainctrl', function($scope) {   $scope.name = 'world'; });