0

I am trying to include angular.js into a project I am working on. I am new to angular. Angular does not seem to be reading my json file and I am not sure what I am doing wrong. I made a test file below that mimics what I am doing at a smaller scale. If anyone can explain to me what I am doing wrong, it would be much appreciated.

Index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset = "UTF-8">
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
    <script src='app.js'></script>
    <script src='MainController.js'></script>
    <title>angular test</title>
</head>
<body>
    <h1>Angular Test</h1>
    <div ng-app = 'myApp' ng-controller='MainController'>
        <p>{{myData}}</p>
    </div>

</body>

controller.js

app.controller('MainController', function($scope, $http) {
   $http.get("data.json").then(function(response) {
      $scope.myData = response.data.test;
   });
});

app.js

var app = angular.module('myApp',[]);

data.json

{
  "test":"This data is from a json file"
}
David Sanders
  • 131
  • 1
  • 3
  • 16
  • What is the error? Where does it seem to be occurring? – sg.cc Jan 30 '16 at 15:47
  • looks like a CORS (cross-origin resource sharing) issue...might check out [this post](http://stackoverflow.com/questions/16930473/angularjs-factory-http-get-json-file) – sfletche Jan 30 '16 at 15:47
  • 1
    Seems to work fine, check [this plunk](https://plnkr.co/edit/WT3bNO1rZMgjHrJMVUoN?p=preview). Perhaps there is a server problem regarding how to serve that json file. What does the network tab in your browser dev tools reveal about this call? – scniro Jan 30 '16 at 15:48
  • here is the link to the test site on my server http://www.davidsandersdesigns.com/build2000/angular.js/test/ – David Sanders Jan 30 '16 at 16:25

1 Answers1

0

The route cause is the comment added in data.json file, please remove the following.

/*
Project: angular test
File: data.json
Author: David Sanders
Date: 
Comments: 
Kudos:
Notes: site data
*/

The JSON file should not contain any comments like this, hence the JSON parson was failing.

Just put,

{
  "test":"This data is from a json file"
}
Siva
  • 2,735
  • 16
  • 14