mia
mia

Reputation: 1238

Each time I load new link, it is redirected to my home link in angular js

I am not able to figure out why this behaviour occur. Each time I try to load new location by clicking anchors, it redirect to root location. I am builing my app in subdirectory http://localhost/myapp/. Kindly see the code below. Here is HTML Code:

<ul class="nav navbar-nav navbar-right">
        <li><a href="!#/">Home</a></li>
        <li><a href="!#/insertLeaveDetails">Insert Leave</a></li>
        <li><a href="!#/currentYearDetails">Current Year</a></li>
        </li>
</ul>

Here is script:

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

app.config(['$routeProvider',function($routeProvider){
    $routeProvider
    .when('/',{
        templateUrl : 'templates/temp.php',
        controller : 'homeCtrl'
    })
    .when('/insertLeaveDetails',{
        templateUrl : 'templates/temp.php',
        controller : 'insertLeaveDetailsCtrl'
    })
    .when('/currentYearDetails',{
        templateUrl : 'templates/temp.php',
        controller : 'currentYearDetailsCtrl'
    })
    .otherwise({
        redirectTo: '/'
    });
}]);

app.controller('homeCtrl',['$scope',function($scope){
    console.log('home ctrl');
    $scope.msg = 'This is home ctrl';
}]);

app.controller('insertLeaveDetailsCtrl',['$scope',function($scope){
    console.log('insert ctrl');
    $scope.msg = 'This is leave ctrl';
}]);

app.controller('currentYearDetailsCtrl',['$scope',function($scope){
    console.log('current deatail ctrl');
    $scope.msg = 'This is current year ctrl';
}]);

Upvotes: 0

Views: 43

Answers (1)

Phil
Phil

Reputation: 164824

The default value for $locationProvider.hashPrefix is "!". This means that, unless you change the provider value, your links should look like

<ul class="nav navbar-nav navbar-right">
    <li><a href="#!/">Home</a></li>
    <li><a href="#!/insertLeaveDetails">Insert Leave</a></li>
    <li><a href="#!/currentYearDetails">Current Year</a></li>
</ul>

Upvotes: 1

Related Questions