Question

我试图使用Angular1创建一个更新电子邮件表单，但是更新它时遇到了麻烦。

所以在表单上，当前的电子邮件显示效果很好，但是当我点击更新按钮时，如果没有对电子邮件进行任何更改，我会收到一个未定义的错误。除非我编辑电子邮件，否则我不会收到错误。

如何避免编辑电子邮件时出现未定义的错误？

加载

点击错误

后

这是html代码

<div class="row" style="margin: 0;">
          <form ng-submit="updateEmail(updateEmailForm)" role="form"
          ng-init="updateEmailForm = {email: userEmail}">
            <div class="col-sm-6 account-input-container" style="padding: 0;">
              <div class="auth-body">
                <div class="form-group">
                  <label>email address</label>
                  <input type="email" name="email" ng-model="updateEmailForm.email"
                  required="required" class="form-control" ng-value="userEmail">
                </div>
              </div>

              <div>
                <button type="submit" class="bubble-btn submit-btn pull-left" style="float: none !important;">update</button>
              </div>
            </div>
          </form>
        </div> <!-- end row -->

ng-model="updateEmailForm.email"应加载来自ng-init w / out设置ng-value的默认值（这就是电子邮件显示的原因），但不是，＆＃39 ; s未定义的来源。

这里是角度控制器

angular.module('myApp')
.controller('accountSettingCtrl', [
'$rootScope',
'$scope',
'$location',
'$state',
'$window',
'Auth',
function($rootScope, $scope, $location, $state, $window, Auth){

  //set activeSetting to 1 to display account setting view on page load
  $scope.activeSetting = 1;

  Auth.getUser().then(function(userData) {
    $scope.currentUser = userData.data;
    $scope.userEmail = $scope.currentUser.email;
  })

 // update account email
 $scope.updateEmail = function() {
   Auth.updateEmail($scope.updateEmailForm)
   .then(function(resp) {
     var messageHandler = resp.data.message;;
     var status         = resp.status
     var elementID = 'updateEmailMsg';
     createMsgDiv(messageHandler, elementID, status);
   })
   .catch(function(resp) {
     var messageHandler = resp.data.message;
     var status         = resp.status
     var elementID      = 'updateEmailMsg';
     createMsgDiv(messageHandler, elementID, status);
     $location.path('/account')
   });
 };

 // Alert Message
 var createMsgDiv = function(messageHandler, elementID, status){
   var div = document.createElement('div');
   if (status == 200) {
    div.setAttribute('class', 'alert alert-success');
   }else{
    div.setAttribute('class', 'alert alert-danger');
   }

 var a = document.createElement('a');
 a.setAttribute('class', 'close');
 a.setAttribute('data-dismiss', 'alert');
 a.setAttribute('aria-label', 'close');

 var exitBtn = document.createTextNode("X")
 a.appendChild(exitBtn);

 var strong = document.createElement('strong');
 var strongText = document.createTextNode(messageHandler);
 strong.appendChild(strongText);

 div.appendChild(a);
 div.appendChild(strong);

 var childBool = document.getElementById(elementID).hasChildNodes();

 if(childBool){
   document.getElementById(elementID).innerHTML = '';
 }
 document.getElementById(elementID).appendChild(div);
 };


 }]);

因此$scope.userEmail应将值传递给ng-init param =＆gt; ng-init = "updateEmailForm = {email: userEmail}"，但事实并非如此。 <{1}}如果ng-model="updateEmailForm.email"不存在，则ng-value为空。

请让我知道我做错了什么，感谢您的帮助！我仍然是Angular的菜鸟。

默认值不在ng-init -ng-submit表单字段中显示 - Angular Js

0 个答案: