Question

我创建了一个模态对话框，并在对话框关闭时尝试读回字段，但是当编辑输入时，输入字段的ng-model被设置为undefined。使用Plunk，如果单击对话框按钮然后按确定而不修改文本字段，它将显示＆＃34; blah＆＃34;。但是，如果您完全修改文本输入，则不会显示任何内容。

对话框模板为：

＆＃13;

  <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>

＆＃13;

模态对话框的控制器：

＆＃13;

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);
  };

});

＆＃13;

我已经看到了对https://stackoverflow.com/a/22768720/552936的引用，但我已经更改了我的代码以反映这一点，并且它还没有解决问题。

Answer 1

您已在模态

的输入字段中声明了输入

timestamp                 | val
--------------------------| ---
2015.12.02D12:19:44.434430| 2
2015.12.02D12:19:44.434440| 8
2015.12.02D12:19:44.434450| 5

type="email"

如果根据电子邮件的数据，它将传递价值。比如<input id="emailInput" type="email" class="form-control" ng-model="user.email">

您可以检查数据是否包含有效的电子邮件

HTML

a@b.com

的 PLUNKR

如果你想传递任何字符串，那么你必须使它<form name="myForm"> <input type="email" name="myEmail" model="myEmail" /> <span>Valid Email {{myForm.myInput.$valid}} </form>。

Answer 2

将其设置为undefined的原因是因为您将电子邮件地址的输入设置为type = email。如果您在该字段中放置了除有效电子邮件地址之外的任何内容，则user.email将设置为undefined。

我刚刚运行你的plunker并输入一个有效的电子邮件地址，可以看到它已经设置正确。在允许提交之前，您应该验证它是一个格式良好的电子邮件地址。

角度ng模型在编辑时设置为未定义

2 个答案: