CODEWITHSUNDEEP
angularjs
Roysh
Roysh

Reputation: 1550

Saving json as an array of objects

I have an angular app that looks like this:

(function (){
    var app = angular.module('world', []);

    app.controller('WorldController', function(){
        this.tabs = tabs; 
    });

    var tabs =[
    {   
        id: "1",
        name: "first tab name",
        title: "first tab title",
        content: "first tab cont"
    },
    {   
        id: "2",
        name: "orci, consectetuer",
        title: "sem elit, pharetra ut,",
        content: "augue scelerisque mollis. Phasellus"
    },
    {   
        id: "3",
        name: "rhoncus. Nullam velit dui, semper et, lacinia vitae,",
        title: "Nam porttitor",
        content: "tellus eu augue porttitor interdum. Sed auctor odio a purus."
    },
    {   
        id: "4",
        name: "nulla magna, malesuada vel, convallis in, cursus et, eros. Proin",
        title: "montes, nascetur ridiculus mus.",
        content: "Sed eget lacus. Mauris non dui nec urna suscipit nonummy."
    }
    ];

})();

I want to load the whole tabs array from a json. I have no problem to generate a json and fetch it, but I don't know how to convert it into the format as shown above.

When I try to do var tabs=jQuery.getJSON('myJson.json');, the json is fetched, but it's not loaded in the format that I want.

How can I convert a json into the format of the array shown above?

While my json looks like that - 

[
    {   
        "id": "1",
        "name": "mus. Proin vel arcu eu odio tristique pharetra.",
        "title": "faucibus",
        "content": "Donec dignissim magna a tortor. Nunc commodo auctor"
    },
    {   
        "id": "2",
        "name": "orci, consectetuer",
        "title": "sem elit, pharetra ut,",
        "content": "augue scelerisque mollis. Phasellus"
    },
    {   
        "id": "3",
        "name": "rhoncus. Nullam velit dui, semper et, lacinia vitae,",
        "title": "Nam porttitor",
        "content": "tellus eu augue porttitor interdum. Sed auctor odio a purus."
    },
    {   
        "id": "4",
        "name": "nulla magna, malesuada vel, convallis in, cursus et, eros. Proin",
        "title": "montes, nascetur ridiculus mus.",
        "content": "Sed eget lacus. Mauris non dui nec urna suscipit nonummy."
    }
];

Upvotes: 0

Views: 906

Answers (1)

yangli-io
yangli-io

Reputation: 17344

Use the $http service in angular. For example, if you have a data.json file in the same folder that contains the json data then use 

app.controller('MainCtrl', function($scope, $http) {
  $http.get('data.json').success(function(data){
    $scope.fetched = data;
  })
});

Here is a plunker example.

Upvotes: 1

Related Questions