Json file not loaded in browser

Question

I am new to angularjs and I am doing a simple study of angular controllers and models. this is my javascript model code.

var testApp = angular.module('testApp', []); testApp.controller('testCtrl', function testCtrl($scope ,$http) { $http.get('test.json').success(function ($data){ $scope.artists = $data; }); }); 

The webpage loads, but an exception is thrown. I am using firefox on windows 7.

[Exception ... "Access to restricted URI was denied" code: "1012" nsresult: "0x805303f4>.> (NS_ERROR_DOM_BAD_URI)" location: "file: ///....// angular.min.js Line: 72 "]

Does anyone know a solution. I do not need to do this on the server, I only need to use the local machine.

Answer 1

You should make minor adjustments to the angular controller syntax.

 testApp = angular.module('testApp', []); testApp.controller('testCtrl', function($scope, $http) { $http.get('test.json').success(function($data) { $scope.artists = $data; }); }); 

Answer 2

As mentioned in the comments above, this is most likely due to Firefox security, which prevents your code from accessing files on the local file system.

You can configure Firefox to access local content by changing your browser configuration.

In Firefox:

• Go to description: config
• Find the security.fileuri.strict_origin_policy parameter
• Set to false

Answer 3

Check it once in chrome by disabling web-based securities and, if the same error occurs, there may be a problem in the url of the json file.

Proceed How to download a local json file?

You can find what the problem is.