Routing does not work in angularjs

Question

I am very new to angular js. I have implemented routing in angular js but it does not redirect me to the pages I have stated in the route.js here is the code: Route.js

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

sampleApp.config(['$routeProvider',
  function($routeProvider) {
$routeProvider.
  when('/getplaces', {
    templateUrl: 'getplaces.html',
    controller: 'ListCtrl',

  }).
  when('/getuncategorisedplaces', {
    templateUrl: 'list.html',
    controller: 'uncatCtrl'
  })
  .otherwise ({
redirectTo: '/getplaces'
  });

}]);

Controller.js

  function uncatCtrl($scope, $http) {
  $http.get('http://94.125.132.253:8000/getuncategorisedplaces').success(function (data) {
  $scope.places = data;
   console.log(data);
    }
    )}
// get places
  function ListCtrl($scope, $http) {
  $http.get('http://94.125.132.253:8000/getplaces').success(function (data) {

   $scope.places = data;
  console.log("Successful")
 console.log(data);
  }
  )}

HTML code includes ng view and href such as href="#getplaces"

<body ng-app="sampleApp" >
<div class="container">
    <div class="row">
    <div class="col-md-3">
       <ul class="nav">
            <li> <a class= "linha" href="#getplaces"> Get places </a></li>
            <li><a class= "linha" href="post.html"> Post a movie </a></li>
                            <li><a class= "linha" href="#getuncategorisedplaces">List of uncategorised places  </a></li>
        </ul>
    </div>
    <div class="col-md-9">
        <div ng-view></div>

    </div>

    </div>

avidenic · Accepted Answer · 2014-06-30 09:34:07Z

1

Check that you have both scripts included (angular and ngroute)

<script src='angular.js'>
<script src='angular-route.js'>

Then check that you are including that module in your app:

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

As of Angular 1.2.0, angular-route is a separate module

refer to the angular documentation:

https://docs.angularjs.org/api/ngRoute

edited Jun 30, 2014 at 9:34

answered Jun 30, 2014 at 9:28

avidenic

6437 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

butYouDontLookLikeADeveloper Over a year ago

I have added it and it does not work. the file I am using can be accessed at "creative.coventry.ac.uk/~4078078/Test%20codes/index.html#/…"

avidenic Over a year ago

check the hrefs. Change them to "/getplaces" and "/getuncategorisedplaces".

butYouDontLookLikeADeveloper Over a year ago

I get an error saying NOT FOUND when I change them to /getplaces from #getplaces

avidenic Over a year ago

Try it if it works for on your local machine. if it does, the servers default document needs to be set etc.

Yagiz Ozturk · Accepted Answer · 2014-06-30 11:31:39Z

0

Here is an example code that i have written a while ago.

var app = angular.module('test', ['ngRoute','ngGrid','ngBootstrap', 'http-auth-interceptor','ui.bootstrap','ngCookies','ngSanitize']).
config(['$routeProvider', function($routeProvider) {
    $routeProvider.
        when('/sign-in', {templateUrl: 'partials/login/signin.html', controller: LoginCtrl}).
        when('/admin/sign-in', {templateUrl: 'partials/login/userManagementSignin.html', controller: LoginCtrl}).
        otherwise({redirectTo: '/dashboard'});
}]);

edited Jun 30, 2014 at 11:31

answered Jun 30, 2014 at 10:57

Yagiz Ozturk

5,4387 gold badges31 silver badges45 bronze badges

Collectives™ on Stack Overflow

Routing does not work in angularjs

2 Answers 2

4 Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Related