将Json文件存储在AngularJS变量中以与'ng-repeat'一起使用

时间:2013-09-27 21:14:28

标签: java javascript json rest angularjs

该项目的目标是在网站中显示Oracle PL / SQL记录。我使用了以下教程(http://draptik.github.io/blog/2013/07/13/angularjs-example-using-a-java-restful-web-service/)来建立与数据库的连接。我能够存储和显示单个记录的值,但是在添加更多记录时却没有。

Sample JSON Information
[  
 {  "firstName":"FN1",  
    "lastName":"LN1",  
    "email":null,  
    "createdBy":-1,  
    "createdDate":"2013-09-24"  
 },  
 {  "firstName":"FN2",  
    "lastName":"LN2",  
    "email":null,  
    "createdBy":-1,  
    "createdDate":"2013-09-24"  
 },  
 {  "firstName":"FN3",  
    "lastName":"LN3",  
    "email":null,  
    "createdBy":-1,  
    "createdDate":"2013-09-24"  
 },  
 {  "firstName":"FN4",  
    "lastName":"LN4",  
    "email":null,  
    "createdBy":-1,  
    "createdDate":"2013-09-24"  
 },  
 {  "firstName":"FN5",  
    "lastName":"LN5",  
    "email":null,  
    "createdBy":-1,  
    "createdDate":"2013-09-24"  
 }  
]  

该示例使用了一个工厂,我确信它正在保存来自json的数据,但我不能让它存储多于单个记录。理想情况下,我可以按照他们在此示例中的方式循环浏览记录:http://jsfiddle.net/pJ5BR/124/

我很感激有这方面的任何建议。这些是目前工厂的定义方式。

services.js:  
services.factory('QueryFactory', function ($resource) {
    return $resource('/Query/rest/json/queries/get', {}, {
        query: {
            method: 'GET',
            params: {},
            isArray: false
        }
    });
});

controllers.js:  
app.controller('MyCtrl1', ['$scope', 'QueryFactory', function ($scope, QueryFactory) {

    QueryFactory.get({}, function (QueryFactory) {
        $scope.firstName = QueryFactory.firstName;
    });
}]);

1 个答案:

答案 0 :(得分:2)

QueryFactory.get()的结果不存储在QueryFactory中,而是存储在返回的promise对象中。此外,您需要使用query()而不是get(),因为响应是数组而不是单个对象。

所以你的控制器应该是这样的:

app.controller('MyCtrl1', ['$scope', 'QueryFactory', function ($scope, QueryFactory) {
    $scope.results = QueryFactory.query();
    // $scope.results is set to a promise object, and is later updated with the AJAX response
}]);

您可以像这样使用HTML中的数据:

<ul ng-controller="MyCtrl1">
  <li ng-repeat="result in results">{{result.firstName}}</li>
</ul>