AngularJS：$http 请求问题 - DOM 未针对 jQuery 函数调用更新

Question

我遇到了一个问题，即调用 $http 请求没有为 jQuery 函数调用更新 DOM。

请查看Plunker

在我的代码 script.js 中，出于测试目的，我将 $scope.components 用作全局和函数。 但是当我将 json 值硬编码到全局变量时，一切正常。当我得到 json 作为 $http 响应时，树结构的展开和折叠功能停止工作。

下面是我的 $http 请求代码

$scope.init = function init() {
$http.get('treeData.json').success(function(data) {
  $scope.components = data;
}).error(function(data) {

});

};

请让我知道我在这里做错了什么。

Answer 1

这是因为您的 jQuery 代码在从 treedata.json 获取数据之前被执行。 $http 将创建一个 Promise，因此在 Promise 得到解决后移动您的 jQuery 逻辑。 我已经更新了 plunker。

[http://plnkr.co/edit/XuxO29FZUoXf84nVvjrg?p=preview][1]

Answer 2

您应该首先定义组件，如下所示： $scope.components = [];

Answer 3

看起来从服务器返回的数据不是 JSON 格式。默认情况下 $http.get 接受 JSON 返回类型。因此，您的成功功能没有得到执行。

更新 您可以检查angular documentation 是否使用 $http。推荐的方式是使用get，如下图所示。

$http.get('/someUrl', config).then(successCallback, errorCallback);

Answer 4

试试 $scope.$apply( $scope.components = 数据 );