Martin Locqueville Martin Locqueville - 6 months ago 35
AngularJS Question

Angular.js not found, but no error on link

I picked up Angular.js yesterday as part of an internship, and Node.js the day before, so I'm a complete beginner with these technologies.

Basically, I tried to make a really simple page with an input field which would print the input text right next to the field, like such. As you can see, it works in a jsfiddle.

But when I try this locally, I get a ReferrenceError at the angular.module call of my controller, and this error in my browser.

Here's my index.html:

<div ng-app="myApp">
<head>
</head>
<body>
<div class="container" ng-controller="AppCtrl">
<input ng-model="query"/>
<span><b ng-bind="queryResult()"></b></span>
</div>



<!-- Scripts et liens css.-->
<script src="./controller.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
<script src="./bower_components/jquery/dist/jquery.js"></script>
<script src="./bower_components/angular/angular.js"></script>
<script src="./bower_components/angular-bootstrap/ui-bootstrap-tpls.js"></script>
<script src="./bower_components/angular-ui-router/release/angular-ui-router.js"></script>
<script src="./bower_components/bootstrap/dist/js/bootstrap.js"></script>
<script src="./bower_components/jquery/dist/jquery.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"></script>
</body>




And my controller.js:

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

myApp.controller('AppCtrl', function($scope) {
$scope.query = "";
$scope.queryResult = function(){
return $scope.query;
};
});


Any idea what I'm doing wrong ?

SSH SSH
Answer

you should include

<script src="./controller.js"></script>

after angular js files