关于javascript：角度控制器范围在jQuery ajax调用后没有更新


Angular controller scope not updating after jQuery ajax call

我有这个代码，我看不出问题的根源在哪里，在Chrome控制台中没有任何错误。我的控制器：

1
2
3
4
5
6
7
8
9
10
11
function notifController($scope) {
  $scope.refreshMsgs = function () {
    $.post("notification-center-trait.aspx")
      .success(function (data) {
        $("#loadedthings").html(data);
        newMsgs = JSON.parse($("#label1").html());
        $scope.msgs = newMsgs;
      });
  }
  $scope.refreshMsgs();
}

label1和label2在DIV加载的铰链内正确加载；

控制台中的newmsgs按照它应该的方式进行解析；

我让它在其他页面上运行，但似乎我在这一页上遗漏了一些东西。我有标签：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
    {{msgs.length}} new msgs :
              <table class="table">
                  <tbody >
                      <tr ng-repeat="msg in msgs">
                        <td>
                            {{msg.sender}}
                        </td>
                        <td>
                            {{msg.message}}
                        </td>
                        <td>
                            {{msg.date}}
                        </td>
                      </tr>
                  </tbody>
              </table>

当我执行以下命令时，控制台中的"未定义"：angular.element($0).scope()。

相关讨论

不管我在评论中指出的其他建筑问题，真正的问题是你使用的是jQuery的ajax，而不是angular的$http。当你不通过角度来做类似的事情时，你在角度的范围之外工作，它不知道变化。虽然不理想，但您可以使用$scope.$apply让angular知道一些超出其知识范围的更新。就像这样：

1
2
3
$scope.$apply(function() {
  $scope.msgs = newMsgs;
});

这意味着Angular已经从它不知道的上下文(本例中的jQueryAjax调用)中修改了它需要知道的内容。

$scope.$apply()有一些有效的用途，例如在事件处理程序中，但在大多数情况下，它是坏做法的标志。对于Ajax调用，您肯定应该使用Angular的$http。

相关讨论