I have just started with angularjs and I am following one tutorial, but I keep getting this error in chrome console
TypeError: Cannot read property 'replace' of undefined
at trimEmptyHash (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.js:10564:13)
at $LocationProvider.$get (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.js:11374:9)
at Object.invoke (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.js:4185:17)
at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.js:4003:37
at getService (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.js:4144:39)
at Object.invoke (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.js:4176:13)
at extend.instance (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.js:8454:21)
at https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.js:7700:13
at forEach (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.js:331:20)
at nodeLinkFn (https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.js:7699:11)
Here is my index.html file
<!DOCTYPE html>
<html lang="en">
<head>
<base href="file:///home/chintan/anges/" />
<meta charset="UTF-8">
<title>angular tutorial</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.js"></script>
<script type="text/javascript" src="main.js"></script>
</head>
<body>
<div ng-app="myOpenRecipes" ng-controller="recipeCtrl">
<h1>{{searchTerm}}</h1>
</div>
</body>
</html>
Here is my main.js file
window.MyOpenRecipes = angular.module('myOpenRecipes', []);
MyOpenRecipes.config(function($locationProvider) {
$locationProvider.html5Mode(true);
});
MyOpenRecipes.controller('recipeCtrl', ['$scope', '$location', function($scope, $location) {
$scope.searchTerm = "Pasta"
}]);
If I remove $location, it works perfectly. What could be wrong?
