Angular ng-model is set to undefined when editing

Question

I create a modal dialog and try to read the fields back when the dialog is closed, but when the input is edited, the ng model for the input field is set to undefined. With Plunk , if you press the dialog button and then press Ok without changing the text box, “blah” appears on the display. But if you change the text input at all, nothing will be displayed.

Dialog Template:

  <script type="text/ng-template" id="simpleModal.html">
    <div class="modal-header">
      <h3 class="modal-title">Simple Modal</h3>
    </div>
    <div class="modal-body">
      <div class="form-group">
        <label for="emailInput">Email</label>
        <input id="emailInput" type="email" class="form-control" ng-model="user.email">
      </div>
    </div>
    <div class="modal-footer">
      <button class="btn" type="button" ng-click="ok()">Ok</button>
    </div>
  </script>

Run code

And the controller for modal dialogue:

app.controller('SimpleModalController', function($scope, $uibModalInstance, $log) {

  $scope.user = {
    email: "blah"
  };

  $scope.ok = function() {
    $log.debug('simpleModal ok called ' + $scope.user.email);
    $uibModalInstance.close($scope.user.email);
  };

});

Run code

I saw a link to https://stackoverflow.com/a/29675/... but I changed my code to reflect this and it did not fix the problem.

Answer 1

type="email"

<input id="emailInput" type="email" class="form-control" ng-model="user.email">

, . [e-mail]

,

HTML

<form name="myForm">
  <input type="email" name="myEmail" model="myEmail" />
  <span>Valid Email {{myForm.myInput.$valid}}
</form>

PLUNKR

, type="text".

Answer 2

, undefined, , type = email. -, , user.email undefined.

, . , , , .