ui-validate test

HTML

<script src="https://raw.github.com/angular-ui/angular-ui/master/build/angular-ui.js"></script>
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<span class="lead">I'm not sure if this is actually a bug. To reproduce the "bug" please press the button and then edit the input.</span>
<br><br>
<div ng-app="ui-validate-test">
  <div class="panel" ng-controller="AppController">
     <form name="testForm">
       <fieldset>
        <input type="text" name="email" ng-model="email" ui-validate="'validateFlag'" ui-validate="'validateFlag'"> 
        <button class="btn btn-primary" ng-click="toggleValidateFlag()">Toggle validateFlag</button> 
      </fieldset>  
     </form>  
     
         
<pre>
  $scope.testForm.email.$modelValue = {{ testForm.email.$modelValue }}
    
  $scope.email = {{ email }}
             
  $scope.testForm.email.$viewValue = {{ testForm.email.$viewValue }}
             
  $scope.testForm.email.$valid = {{ testForm.email.$valid }}
             
  $scope.validateFlag = {{ validateFlag }}</pre>        
  </div>
</div>
<br><br>
    <span class="lead"><strong>Result</strong>: The ModelController is valid but its $modelValue is empty</span>
<br><br>
<span class="lead">I think that the problem is because ui-validate-watch execute the validator expression but don't set $modelValue or $viewValue according.</span>

JavaScript

angular.module('ui-validate-test', ['ui'])

.controller('AppController', ['$scope', function($scope){
    $scope.email = "[email protected]";
    $scope.validateFlag = false;
    
    $scope.sho
    
    $scope.toggleValidateFlag = function(){
        $scope.validateFlag = !$scope.validateFlag;
    };
    
    $scope.$watch('email', function(){
        $scope.toggleValidateFlag();
    });
}]);