【问题标题】:AngularJS $http not firing get callAngularJS $http 没有触发 get 调用
【发布时间】:2013-07-17 13:46:07
【问题描述】:

我有一个关于从 AngularJS 中的多个来源触发 $http.get 的问题。下面的代码非常简单: 我有 $scope.test 函数,它是 HTML 中一个按钮的单击处理程序。这个$http.get 工作正常。 然后我有$http.get,它从服务器获取一些数据并创建基本的原语图表。非常简单,这也有效。然后,我想在每个图表节点和按钮处理程序上附加按钮,我想执行另一个$http.get 调用。但是这个不行!

代码如下:

$scope.test = function () {
    console.log('Klic na ID 1');
    $scope.commonController.getData('orgunit/1?jsonDepth=3')
        .success(function(workpositionData,status,headers,config) {
            console.log('Klic na ID 1 OK');
            $scope.workPositions = workpositionData.workPositions;
        }).error(function(data,status,headers,config) {
            commonController.error('Pri branju delovnih mest je prišlo do napake: '+data.description);
        });
};


var options = new primitives.orgdiagram.Config();    
var itemB, itemC, itemD, itemE;
var rootItem = new primitives.orgdiagram.ItemConfig();

options.rootItem = rootItem;
options.cursorItem = rootItem;
options.hasSelectorCheckbox = primitives.common.Enabled.True;

var buttons = [];
buttons.push(new primitives.orgdiagram.ButtonConfig("add", "ui-icon-folder-open", "Add0"));     
options.buttons = buttons;

options.onButtonClick = function (e, data) {
    console.log('Klic na ID '+data.context.id);
    $http.get('proxy/api/orgunit/' + data.context.id + '?jsonDepth=3')
    .success(function(workpositionData,status,headers,config) {
        console.log('Klic na ID '+data.context.id + ' OK');
        $scope.workPositions = workpositionData.workPositions;
    }).error(function(data,status,headers,config) {
        commonController.error('Pri branju delovnih mest je prišlo do napake: '+data.description);
    });                 
};

$http.get('proxy/api/orgunit/tree?jsonDepth=2')
.success(function(orgUnitsData,status,headers,config) {
    console.log('Reading orgunit tree ok');

    rootItem.title = orgUnitsData.orgUnits[0].title;
    rootItem.description = orgUnitsData.orgUnits[0].description;        
    rootItem.id = orgUnitsData.orgUnits[0].id;
    rootItem.hasSelectorCheckbox = false;
    rootItem.image = "http://www.basicprimitives.com/demo/images/photos/a.png";

    $scope.addItems(rootItem, orgUnitsData.orgUnits[0].subordinates, 0);
    jQuery(".basicdiagram").orgDiagram(options);


}).error(function(data,status,headers,config) {
    console.log('Reading orgunit not ok');
}); 

我尝试了很多创建此图表的组合(指令、单独的模板和控制器,...),但没有任何效果。从图表注释上的按钮调用 $http.get 不会触发(Chome 开发者工具中的网络中没有任何内容)。

但有趣的是:如果我再次执行 test 函数(单击 html 按钮),我会从 $http.get 的测试函数 AND 获得响应图表按钮。看起来来自图表按钮的 $http.get 调用正在等待某些东西,当这个东西出现时,它就会触发。

有谁知道解决这个问题的方法是什么?在控制台输出场景执行测试,执行图表按钮功能,执行测试是这样的(粗体是图表按钮功能的控制台条目,非粗体来自测试功能:

Klic na ID 1 Klic na ID 1 确定 Klic na ID 4 Klic na ID 1 Klic na ID 1 确定 Klic na ID 4 OK

如果您对此有任何想法,请告诉我,这件事在过去的几个小时里让我发疯了。 更新

我用解决方案解决了它,在这里找到https://github.com/angular/angular.js/issues/2794#issuecomment-18807158,所以我用 $scope.$apply 包装了我的调用函数。

$scope.$apply(function() {
    console.log('Klic na ID ' + data.context.id);
    $scope.commonController.getData('orgunit/' + data.context.id + '?jsonDepth=3')
    .success(function(workpositionData,status,headers,config) {
        console.log('Klic na ID ' + data.context.id + ' OK');
        $scope.workPositions = workpositionData.workPositions;
    }).error(function(data,status,headers,config) {
        commonController.error('Pri branju delovnih mest je prišlo do napake: '+data.description);
    });
});

最好的问候

【问题讨论】:

  • 尝试将 scope.$apply() 放入代码中
  • 具体在哪里?我认为 $apply() 不会解决问题,因为问题是 $http.get 没有触发,而不是结果没有在 UI 中重新渲染。
  • 你的意思是像我写的问题更新?如果是的话,你一直都是对的,我只是不明白你的意思。

标签: javascript http angularjs get


【解决方案1】:

从角度 1.1.4 开始,您需要在角度摘要循环的上下文中调用 $http。如果您不这样做,那么您可以在 http 调用之后手动调用 $scope.$apply();。见https://github.com/angular/angular.js/issues/2431#issuecomment-18566595

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-03-09
    • 2016-11-13
    • 1970-01-01
    • 2023-03-18
    相关资源
    最近更新 更多