Store JSON data into a variable

Question

I am new to AngularJS. I just want to load the JSON file data into a variable that is located in factory.

myApp.factory('quizFactory', function () {
    var questions = [
        {
            "setId":1,
            "question":"What is the value of the 7 in the following number? 850,765",
            "options": ["70", "7", "7000", "700"],
            "answer": 3
        },
        {
            "setId":2,
            "question":"Is 7 & 9 even or odd?",
            "options": ["Even", "Odd", "Can't Say", "Dont know"],
            "answer": 1
        },
        {
            "setId":3,
            "question":"In the number 5,281,946 what is the value of the 3rd place?",
            "options": ["100", "10,000", "1,000,000", "1,000"],
            "answer": 0 
        },
        {
            "setId":4,
            "question":"Is 12 + 50 even or odd?",
            "options": ["Even", "Odd", "Can't Say", "Dont know"],
            "answer": 0 
        },
        {
            "setId":5,
            "question":"What does the 3 represent in the number below? 3051",
            "options": ["3", "30", "300", "3000"],
            "answer": 3 
        }
    ];

    return {
        getQuestion: function(id) {
            if(id < questions.length) {
                return questions[id];
            } else {
                return false;
            }
        }
    };
});

The above code is stored in app.js file and my JSON file is same as the above.

[


{
        "setId":1,
        "question":"What is the value of the 7 in the following number? 850,765",
        "options": ["70", "7", "7000", "700"],
        "answer": 3
    },
    {
        "setId":2,
        "question":"Is 7 & 9 even or odd?",
        "options": ["Even", "Odd", "Can't Say", "Dont know"],
        "answer": 1
    },
    {
        "setId":3,
        "question":"In the number 5,281,946 what is the value of the 3rd place?",
        "options": ["100", "10,000", "1,000,000", "1,000"],
        "answer": 0 
    },
    {
        "setId":4,
        "question":"Is 12 + 50 even or odd?",
        "options": ["Even", "Odd", "Can't Say", "Dont know"],
        "answer": 0 
    },
    {
        "setId":5,
        "question":"What does the 3 represent in the number below? 3051",
        "options": ["3", "30", "300", "3000"],
        "answer": 3 
    }
];

I have tried this question too.

sol4me · Accepted Answer · 2015-05-22 10:38:04Z

3

You can use $http to read json file. E.g.

$http.get('someFile.json').success(function(data) {    
        questions = data;
    });

answered May 22, 2015 at 10:38

sol4me

15.8k6 gold badges37 silver badges35 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Ramana Uday Over a year ago

I replaced my JS file from above with myApp.factory('quizFactory',['$http', function ($http) { $http.get('ques.json').success(function(data) { var questions = data; }); }); but still not working it is unable to load the json file

sol4me Over a year ago

It should work, may be your json file is not in the correct place. Here is the working demo plnkr.co/edit/PpRvBhbZ9LHT8EQeUV2a?p=preview

Ramana Uday Over a year ago

In the app.js file if I change app.controller to app.factory it is not working

Ramana Uday Over a year ago

Sorry for asking so many questions can u help where should i add the controller data in this plnkr.co/edit/fOJoCVuIksmD3LSnGqBt?p=catalogue myApp.directive file

sol4me Over a year ago

I would be glad to help :) , could you please post a new question describing what's the problem

|

Master Mind · Accepted Answer · 2015-05-22 10:54:53Z

0

You can redefine your factory like this :

  angular.module('yourmodule')
 .factory('jsonResourceService', ['$http',
function($http) {
  var jsonResourceService = {};

  jsonResourceService.load = function(callback) {
    $http.get('path/data.json').success(function(data) {
      callback(data);
    });
   return jsonResourceService;


}
]);

and call it from your controller like this :

     $scope.objectsArray = [];

  jsonResourceService.load(function(data) {
 $scope.objectsArray;
});

edited May 22, 2015 at 10:54

answered May 22, 2015 at 10:43

Master Mind

3,0844 gold badges35 silver badges65 bronze badges

2 Comments

Hardy Over a year ago

why need forEach loop? instead you can directly store data into array object.

Master Mind Over a year ago

Edited just now in my case i was doing some extra processing before adding it to the array .

halfer · Accepted Answer · 2018-02-15 23:21:48Z

0

If I want to add the JSON data to the factory variable on the some particular request inside a controller is what you meant, then $http is the preferable one:

     appmodule.controller('appCtrl',   ['$http','quizFactory',function($http,quizFactory){
        $http('somefile.json').success(function(data){
           quizFactory.questions=data;  
        }
     })

Here note that you have to dependency inject the factory, and yes, it is not necessary to manually parse the data, Angular will automatically look after it.

edited Feb 15, 2018 at 23:21

halfer

20.2k19 gold badges110 silver badges207 bronze badges

answered May 22, 2015 at 10:47

Nishi Bangar

97810 silver badges22 bronze badges

Collectives™ on Stack Overflow

Store JSON data into a variable

3 Answers 3

6 Comments

2 Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

6 Comments

2 Comments

Comments

Linked

Related