将json字符串转换为随机数量的JSON对象

时间:2016-01-06 15:38:03

标签: javascript angularjs json

我有一个问题,如何更改json对象内的json字符串以获取随机数量的对象。让我用我的代码和评论进一步解释。

我有提供json对象的工厂

//Factory for products
app.factory('productsFactory', ['$http', '$location', function($http, $location){
    var factory = {};
    factory.getlatestProductsList = function(n){
        return $http.get($location.protocol() + '://' + $location.host() + '/server/api/products/latest/'+n);
    }
    return factory;
}]);

此工厂返回一些随机数量的对象

0: Object
active: "1"
alias: "baumbach-circle"
date_c: "2016-01-06 08:09:54"
date_u: null
description: "Corrupti fugit iste quo sunt quidem voluptatibus dolorem. Eos velit architecto veritatis doloribus. Corporis sequi cupiditate possimus voluptates ut consequatur. Accusantium libero qui est sunt et."
id_category: "46"
id_product: "25"
id_user: "177"
images: "[{"thumbImage":"http:\/\/lorempixel.com\/250\/150\/?63763","image":"http:\/\/lorempixel.com\/1024\/768\/?52630","position":0},{"thumbImage":"http:\/\/lorempixel.com\/250\/150\/?99795","image":"http:\/\/lorempixel.com\/1024\/768\/?84669","position":1},{"thumbImage":"http:\/\/lorempixel.com\/250\/150\/?17506","image":"http:\/\/lorempixel.com\/1024\/768\/?88926","position":2},{"thumbImage":"http:\/\/lorempixel.com\/250\/150\/?73869","image":"http:\/\/lorempixel.com\/1024\/768\/?91917","position":3},{"thumbImage":"http:\/\/lorempixel.com\/250\/150\/?70019","image":"http:\/\/lorempixel.com\/1024\/768\/?18509","position":4}]"
name: "Baumbach Circle"
__proto__: Object
1: Object
active: "1"
alias: "elta-road"
date_c: "2016-01-06 08:09:53"
date_u: null
description: "Culpa perferendis dolores rerum deleniti vero cumque. Similique explicabo beatae est quo sit nisi. Et a voluptatem nihil in. Voluptates modi qui est ducimus corrupti."
id_category: "46"
id_product: "24"
id_user: "73"
images: "[{"thumbImage":"http:\/\/lorempixel.com\/250\/150\/?53746","image":"http:\/\/lorempixel.com\/1024\/768\/?49502","position":0},{"thumbImage":"http:\/\/lorempixel.com\/250\/150\/?75052","image":"http:\/\/lorempixel.com\/1024\/768\/?77727","position":1},{"thumbImage":"http:\/\/lorempixel.com\/250\/150\/?32463","image":"http:\/\/lorempixel.com\/1024\/768\/?76121","position":2},{"thumbImage":"http:\/\/lorempixel.com\/250\/150\/?61377","image":"http:\/\/lorempixel.com\/1024\/768\/?89434","position":3},{"thumbImage":"http:\/\/lorempixel.com\/250\/150\/?86873","image":"http:\/\/lorempixel.com\/1024\/768\/?82513","position":4}]"
name: "Elta Road"
__proto__: Object

问题是图像json是字符串格式,所以我必须使用JSON.parse(至少我是这么认为,因为我是新手)将它们转换为JSON

我的问题是:是否有一些简单的方法可以将所有图像数据解析为json,或者我必须使用forEach执行此操作,如果是这样,代码将如何显示。我不想在工厂内实现这种效果,所以我不必在每个叫这个工厂的控制器中重复代码。

如果您需要任何其他信息,请告诉我,我会提供。提前谢谢。

3 个答案:

答案 0 :(得分:1)

您可以在返回之前编辑$ http返回的答案

app.factory('productsFactory', ['$http', '$location', function($http, $location){
    var factory = {};
    factory.getlatestProductsList = function(n){
        var url = $location.protocol() + '://' + $location.host() + '/server/api/products/latest/'+n;
        return $http({
            method: 'GET',
            url: url
        }).then(function successCallback(response) {
            // you can edit the response her, and parse it
            return response ;
        }, function errorCallback(response) {

        });
    }
    return factory;
}]); 

答案 1 :(得分:0)

您可以使用$ http返回promise的事实,然后在返回promise之前对数据进行一些处理。这对你有用吗 - 让我知道你是否需要ES5

factory.getlatestProductsList = function(n){
    return $http.get($location.protocol() + '://' + $location.host() + '/server/api/products/latest/'+n)
    .then(data => data.map(elem => {
       var tmp = Json.parse(elem.images);
       elem.images = tmp
       return elem;
    }));

在es5中

factory.getlatestProductsList = function(n){
    return $http.get($location.protocol() + '://' + $location.host() + '/server/api/products/latest/'+n)
    .then(function(data) {
       return data.map(function(elem) {
         var tmp = Json.parse(elem.images);
         elem.images = tmp
         return elem;
       });
    });

答案 2 :(得分:0)

粘贴代码,如果有人想看看它是什么样的

//Factory for products
app.factory('productsFactory', ['$http', '$location', function($http, $location){
    var factory = {};
    factory.getlatestProductsList = function(n){
        var url = $location.protocol() + '://' + $location.host() + '/server/api/products/latest/'+n;
        return $http({
            method: 'GET',
            url: url
        }).then(function successCallback(response) {
            var pros = response.data;
            pros.forEach(function(item){
                var pictures = JSON.parse(item.images);
                delete item.images;
                item.images = pictures;
            })
            return pros;
        },function errorCallback(response) {
            console.log('error fetching latest products: ' + response);
        });
    }
    return factory;
}]);