AngularJS routing, wrong link

Question

I am trying to learn AngularJS routing and I am facing a little problem.

I am working on a simple HTML file on my computer (which means the Url looks like file:///C:/Users ...)

I don't know what to put in the link in the / template to make it work. I tried with home, /home, #home, #/home ... But nothing seems to work.

Could you please help me ?

Here are the files : (route1.html only contains an input)

HTML file

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
<!doctype html>
<html ng-app="myApp">
 <head>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
  <script src="js/main2.js"></script>
 </head>
 <body>
  <div ng-view>
  </div>
 </body>
</html>

JavaScript File

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

app.config(['$routeProvider', function($routeProvider) {

 $routeProvider
 
 .when('/', {
  controller: 'HomeController', 
  template: '<h1>Hey</h1><a href="#/home">Go to home</a>'
 }).otherwise({redirectTo: '/'})
 
 .when('/home', {
  controller: 'HomeController', 
  templateUrl: 'route1.html'
 })
}]);

app.controller('HomeController', function($scope) {
 $scope.name = 'John';
});

Take a look at http://stackoverflow.com/questions/19502978/do-angular-views-work-when-a-site-is-served-from-the-local-file-system , I think you cannot use ngRoute without a server — bviale, Sep 16 '15 at 12:54
Why, thank you I guess ... This is not what I expected, so I'll assume the routing works. — , Sep 16 '15 at 12:57

score 0 · Accepted Answer · edited May 23 '17 at 12:29

0

AngularJS routing implicitly uses Ajax to reach the new URL and provide you the corresponding view. So you will need a server to provide this pages if you want to test your routes (can be very easy to set up a light apache or node.js static server).

There is more discussions about it in this thread.

edited May 23 '17 at 12:29

Community

1
1

answered Sep 16 '15 at 13:03

bviale

5,245
3
28
48

score 0 · Answer 2 · edited Sep 16 '15 at 13:42

0

uI resolved your issue by adding latest angular.js V1.4.5 and angular.route.js same version. and also made changes in main2.js as below

var app = angular.module('myApp', ['ngRoute']);

and rest is fine, Thanks.

edited Sep 16 '15 at 13:42

Tamir Vered

10,187
5
45
57

answered Sep 16 '15 at 13:29

Aashish Kumar

11
3

AngularJS routing, wrong link

2 Answers2