Recently, I started exploring Angular JS and encountered an issue while attempting to use the $http service in my project. Below is the code snippet that caused the error.
In the code, you can see that I have initialized <ng-app="myapp"> and created a controller for it. Following the tutorial instructions, I registered the controller in View.js and tried to fetch data from a 'data.json' file. However, when running the program, I received an error stating that $http is not defined.
View.html
<!DOCTYPE html>
<html lang="en">
<head>
<script
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular.min.js"></script>
<script src="js/View.js"></script>
</head>
<body ng-app="myapp">
<div ng-controller="Object">
<span ng-bind="o.rollNo"></span>
<span ng-bind="o.firstName"></span>
<span ng-bind="o.middleName"></span>
<span ng-bind="o.lastName"></span>
<span ng-bind="o.className"></span>
<span ng-bind="o.schoolName"></span>
</div>
</body>
</html>
View.js
var app=angular.module("myapp", []);
app.controller('Object',function($scope,$http) {
$http.get("data.json")
.success( function(response) {
$scope.o= response;
});
});
data.json:
[
{
"rollNo" : "1",
"firstName" : "ABC",
"middleName" : "DEF"
"lastName" : "HIJ"
"className" : "First"
"schoolName" : "CRB"
}
]