sujay kodamala sujay kodamala - 6 months ago 8
Javascript Question

Javascript files are not loading

I'm new to Angular JS , trying to develop little application on Calculations .
My Code is as follows"

<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8" />
<script src="scripts/angular.js"></script>
<script src="scripts/angular-route.js"></script>
</head>
<body>
<div ng-app="Calculator">
<div ng-controller="Operations">
<div>
Number 1 : <input type="number" ng-model="Number1" />
Number 2: <input type="number" ng-model="Number2" />
<p>
The addition of above two numbers is {{Number1+Number2}}
</p>
</div>

</div>
</div>
<script>
var module = angular.module('Calculator', []);
module.controller('Operations', function ($scope) {
$scope.Number1 = 1;
$scope.Number2 = 10;
});
</script>
</body>
</html>


I have the Javascripts files available in My project, When I run the app, the browser console indicates that the JS are not being loaded. Don't know why !
The Expression {{Number1+Number2}} is the same in browser . It is not executing the expression

The Browser console has following errors:


Failed to load resource:"Path to the Script file" the server responded with a
status of 404 (Not Found)

Failed to load resource:"Path to the Script file" the server responded with a
status of 404 (Not Found)

Uncaught ReferenceError: angular is not defined

Answer

Your project structure has to look like

index.html
scripts
    |---angular.js
    |---angular-route.js

If you use

<script src="scripts/angular.js"></script>
<script src="scripts/angular-route.js"></script>
Comments