winsticknova winsticknova - 5 months ago 22
AngularJS Question

Load JSON file using AngularJS

I just started learning Angular and I've looked on SO for a solution to load a JSON file using angular and I've done what other people have posted a solutions but I cannot get the data from my json file to show for some reason.

my json file (test.json) is simple:

{
"array": [
{"thing": "thing1"},
{"thing": "thing2"},
{"thing": "thing3"}
],

"name": "robert"
}


this is my js file:

var myMod = angular.module("myMod", []);

myMod.controller("myCont", function ($scope, $http) {
$scope.thing = "hi";

$http.get("/test.json")
.success(function (data) {
$scope.stuff = data.array;
$scope.name = data.name;
})
.error(function (data) {
console.log("there was an error");
});
});


and i'm trying to just display the name like this but only
{{name}}
shows:

<html ng-app="myMod">
<head>
<script src="angular.js"></script>
<script src="testing.js"></script>
</head>

<body ng-controller="myCont">
{{stuff}}
</body>
</html>

Answer

I think you had typo, you should inject $http(responsible to make an ajax call) dependency instead of $html(doesn't exist in angular)

You should change code this way.

myMod.controller("myCont", function ($scope, $html) {

to

myMod.controller("myCont", function ($scope, $http) {
Comments