How to get ui.bootstrap timepicker control to pass validation by default, without user interacting with control

Question

When the timepicker control is inside a form and has an initial 'valid' default value, it should validate and $scope.formname.$valid should be true. However, what I am seeing is that unless the user interacts with the control, it's not validated and the form is not in valid state, this is not acceptable since the user may not even want to change the default time value. Any ideas what can be done for angular to validate the control with its default value and form respectively.

https://plnkr.co/edit/p1I2NoNpg3XMzijHUadi?p=preview

<form name="myForm" novalidate>
  <uib-timepicker ng-model="time" template-url="timepicker.html" hour-step="1" ng-required="true" minute-step="1" show-meridian="false" ></uib-timepicker>

  <input type="submit" value="Form state" ng-click="alertState()"></button>
</form>




 var app =  angular.module('demo',['ui.bootstrap']);


  app.controller('myCtrl',[ '$scope', function($scope) {



  $scope.alertState = function() {
    alert($scope.myForm.$valid);
  };

  }]);