Question

首先是我的档案：

app.js

var app = angular.module("CODETEST", ['ngRoute']);

// Routing Configuration
app.config(function($routeProvider) { 
$routeProvider
    // route for the home page
    .when('/', {
        controller: 'HomeController', 
        templateUrl: 'index.php'
    })
    .otherwise({
        redirectTo: '/'
    });

});

people.js

app.factory('users', ['$http', function($http) { 
function callExternalJson() {
    return $http.get('js/services/testperson.json')
}

return callExternalJson;
}]);

HomeController.js

app.controller('HomeController', ['$scope', '$rootScope', 'users', function($scope, $rootScope, users ) {

users.success(function(data){
    $scope.users = data.person;
});

}]);

这是问题所在。

这只是一个测试JSON文件来实现这一点，但是我将要检索的实际JSON文件会在每次点击时动态重新生成，这就是为什么我people.js设置这种方式因为我正在点击无限循环。昨晚有人帮助了我。

但是，我还有两个问题： 1）如何在控制器中提取数据，以便在页面中使用它？

2）get in people.js返回一个空结构。我确定文件在那里，但它没有得到任何数据。

思想？

Answer 1

将您的工厂代码更改为以下内容，

app.factory('users', ['$http', function($http) { 
    return {
        // you can add multiple functions separating them with comma and access them in your controller
        callExternalJson: function() {
            return $http.get('js/services/testperson.json').then(function (response) {
                return response;
            });
        }
    }
}]);

在你的控制器中，

app.controller('HomeController', ['$scope', '$rootScope', 'users', function ($scope, $rootScope, users ) {
    users.callExternalJson()
      .then(function (response) {
        $scope.users = response.data;
    });
}]);

Answer 2

尝试从index.php删除templateUrl。

templateUrl应包含您的路线的特定HTML，而不是整个HTML页面。现在，ng-view正在填充整个页面，这会变得混乱。

如果我查看您网页的来源，您根本不需要templateUrl，以便您的应用按预期工作。

Answer 3

你可以尝试：

users().then(function(response){
    $scope.users = response.data.person;
});

Answer 4

我不确定如何做到这一点，但我想将你们两个标记为正确答案。来自@Chinni的整体代码就是答案，@ Prashant-palikhe的templateUrl解决了循环。

谢谢！

app.factory没有检索JSON

4 个答案: