Angular $http 未在 $routeProvider 中解析

Question

我正在尝试将 JSON 文件中的数据显示到网页上。我的代码

angular.module('bioA.configs',['ngRoute'])
//Config routes
.config(['$routeProvider',function($routeProvider){
    $routeProvider.when('/',
    {
        templateUrl: 'list.tpl.html',
        controller: 'BioACtrl',
        resolve: {
            bioAList: ['$http',function($http){
                return $http.get('bioa.json');
            }]
        }
    });
}]);
//Controller to Manage the data
angular.module('bioA.controllers',['bioA.configs'])
.controller('BioACtrl',['bioAList','$scope',function($scope,bioAList){
    console.log(bioAList);
    $scope.samples = bioAList.data.samples;
}]);
angular.module('bioA',['ngRoute','bioA.controllers','bioA.configs','ui.bootstrap']);

$http 似乎没有解决。 这是控制台输出： 我是 AngularJS noob 任何帮助表示赞赏:) 我被卡住了。为什么解析的对象是 ChildScope 而不是 Promise？

Answer 1

首先，您的包含在此处颠倒

controller('BioACtrl',['bioAList','$scope',function($scope,bioAList){

应该是

controller('BioACtrl',['$scope', 'bioAList',function($scope,bioAList){

其次，您甚至在获取数据之前就尝试访问 bioAList 服务中的数据。正确的方法是使用角度承诺。我修改了plnkr 来实现这种访问范式：

bioAList.getSamples().then(function(data) {
    $scope.samples = data.samples;
})

编辑：添加@OdeToCode 指出的内容。

好点！您可以将 $http 承诺作为服务返回。

return $http.get('bioa.json').success(function(data,status){
    return data;
})

并像原来一样访问它。

希望这会有所帮助！