AngularJS alert alert-success 未显示成功 div 在函数响应成功时

Question

下面是 HTML 用户输入他们的电子邮件地址和学生 ID 的代码：

<div id="statusScope" class="pos-rel" style="margin:0 auto 50px;" ng-controller="statusController">
  <form class="form-inline text-center" action="">
    <div class="form-group">
      <label for="email">Email address:</label>
      <input type="email" class="form-control" id="email" ng-model="email">
    </div>
    <div class="form-group">
      <label for="sID">Student ID:</label>
      <input type="text" class="form-control" id="sID" ng-model="sID">
    </div>
  <br/>
  <br/>
    <button type="button" class="btn btn-primary" ng-click="emailCheck()">E-mail Check</button>
  </form>
  <div class="alert alert-success" ng-if="msg.success">{{msg.success}}</div>
  <!-- <div class="col-lg-12 col-sm-12 col-xs-12 alert alert-success ng-hide" ng-show="isDisplay"><strong>{{msg.success}}</strong></div> -->

  <div class="alert alert-danger" ng-if="msg.noStudent">{{msg.noStudent}}</div>
  <br>
</div>

下面是检查电子邮件地址和学生 ID 的代码，returns 如果两者都正确则成功，否则 returns "incorrect details" 如果详细信息不匹配。

$scope.emailCheck = function() {
            var _to = $scope.email,
                    _studentID = $scope.sID,
                    _subject = "System Notify.",
                    // _file1 = student[0].tfile1,
                    _msg = "Hello, "+_to+". \r\n"+"Your course enrollment application status is " + "$('#status').val()" + ". \r\n";
                    // _file1 = "Your file 1 is "+_tfile1+". \r \n "+ +"$('#tfile1').val()"+ ".";

            var all = [].concat($scope.users.cis300, $scope.users.cis400, $scope.users.cis500);

            var student = all.filter(function(item) {
                return item.email == _to && item.studentid == _studentID;
            });

if(student && student.length) {
                    var _file1 = student[0].tfile;
                    var _file2 = student[0].tfile1;
                    var _file3 = student[0].tfile2;
                    _msg = "Hello, "+student[0].firstname+" "+student[0].middlename+". "+student[0].lastname+". \r\n"+"Your status is " + student[0].status + ". \r\n",
                    // _file1 = student[0].tfile1;
                    console.log(_file1);
                    console.log(_file2);
                    console.log(_file3);
                    console.log(_to);
                    $scope.msg = {};
                    $.post('php/mail.php', 
                    JSON.stringify({
                            'to': _to,
                            'subject': _subject,
                            'file1': _file1,
                            'file2': _file2,
                            'file3': _file3,
                            'msg': _msg

                    }),

                function(response, status) {    
                    console.log(_status);
                    $scope.isDisplay = true;
                        $scope.msg.success = "Success! Check your Email";
                    });
                } else {
                    $scope.msg = {};
                    $scope.msg.noStudent = "Email or Student ID is incorrect.";
                }

当我输入错误的详细信息时，我会立即收到 "Student ID or Email is incorrect"，但是当我输入正确的详细信息时，会向用户发送电子邮件，但不会提示成功。只有在我输入内容或在电子邮件或学生 ID 字段中进行一些更改后，它才会向我显示成功警报。

Answer 1

承诺解决方案在摘要周期之外，因此 Angular 不会看到您对 $scope 所做的更改，直到其他事情触发摘要周期。您需要将更改包装在 $scope.$apply() 中以强制执行摘要循环并允许 Angular 查看更改并更新视图。

function(response, status) {
    console.log(_status);
    $scope.$apply(function() {
        $scope.isDisplay = true;
        $scope.msg.success = "Success! Check your Email";
    });
} else { [...]

AngularJS alert alert-success 未显示成功 div 在函数响应成功时

AngularJS alert alert-success not showing the success div at the time the function responds success

javascript

angularjs

angular-ui-bootstrap