Question

我想交换一个数组并获取一个json文件，但不知道为什么我的代码中存在错误的地方（没有http请求的服务/控制器部分工作）。

有罪的代码

(function() {
  (function() {
    var JsonsService;
    JsonsService = function($http) {
      var pizze;
      pizze = [];
      return {
        getPizze: function() {
          $http.get('data/pizze-it.json').then(function(pizze) {
            pizze = pizze.data;
          });
        }
      };
    };
    JsonsService.$inject = ['$http'];
    angular.module('myApp').factory('JsonsService', JsonsService);
  })();

}).call(this);

(function() {
  (function() {
    var JsonsCtrl;
    JsonsCtrl = function(JsonsService) {
      var self;
      self = this;
      self.list = function() {
        return JsonsService.getPizze();
      };
    };
    JsonsCtrl.$inject = ['JsonsService'];
    angular.module('myApp').controller('JsonsCtrl', JsonsCtrl);
  })();

}).call(this);

Plnkr

我从app.js中删除了导致此错误的整个代码块（服务和控制器），并将其放在DontLoadThis.js中（还有一些标记可以放回到main.html中）

Answer 1

这不一定是明确的答案，但我注意到的一些事情看似错误。

从JsonsService开始：

JsonsService = function($http) {
    var pizze;
    pizze = [];
    return {
        getPizze: function() {
            $http.get('data/pizze-it.json').then(function(pizze) {
                pizze = pizze.data;
            });
        }
    };
};

您正在初始化变量pizze，但也使用pizze中的回调变量$http.get()。相反，我建议：

var pizze = [];

...

$http.get('data/pizze-it.json').then(function(json_response) {
    pizze = json_response.data;
});

然而，第二个问题使这变得多余：JsonsService.getPizze()实际上并没有返回任何内容。解决此问题的一种可能方法是从getPizze()返回承诺并在控制器中处理结果。

// in service
return {
    getPizze: function() {
        return $http.get('data/pizze-it.json');
    }
};

// in controller
JsonsCtrl = function(JsonsService) {
    var self;
    self = this;
    self.list = [];

    JsonsService.getPizze().then(function (json_response) {
        self.list = json_response.data;
    });
};

$ http.get导致infinites调用（和错误），直到计算机崩溃

1 个答案: