Reputation: 119
I am setting up my angular routes in the app.js as so:
.config(function ($routeProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/main.html',
controller: 'MainCtrl',
controllerAs: 'main'
})
.when('/characters', {
templateUrl: 'views/characters.html',
controller: 'AboutCtrl',
controllerAs: 'characters'
})
.when('/framedata', {
templateUrl: 'views/framedata.html',
controller: 'FrameDataCtrl',
controllerAs: 'frame'
})
.otherwise({
redirectTo: '/'
});
});
These URLs do work because when I type in localhost:9000/framedata or /characters it displays the view I expect. When I used the navigation bar that defines the links as expected there is a '#%2F' that is added like so: http://localhost:9000/#!/#%2Fcharacters
<ul class="nav navbar-nav">
<li class="active"><a href="#/">tekkenMitzu?</a></li>
<li><a ng-href="#/characters">Characters</a></li>
<li><a ng-href="#/framedata">Frame Data</a></li>
</ul>
I hope this gives sufficient information, please let me know if I should give you some more information, if it is necessary I can upload this to a domain so you can see the 'live' version.
Upvotes: 1
Views: 2539
Reputation: 38713
Try this below code
.config(function ($routeProvider,$locationProvider) {
$routeProvider
.when('/', {
templateUrl: 'views/main.html',
controller: 'MainCtrl',
controllerAs: 'main'
})
.when('/characters', {
templateUrl: 'views/characters.html',
controller: 'AboutCtrl',
controllerAs: 'characters'
})
.when('/framedata', {
templateUrl: 'views/framedata.html',
controller: 'FrameDataCtrl',
controllerAs: 'frame'
})
.otherwise({
redirectTo: '/'
});
// use the HTML5 History API
$locationProvider.html5Mode(true);// it will remove the #
});
And your URL having some white space if you remove the space then the
%2F
will clear
More details, please checkout it
AngularJS converting my ng-href url "slash" into "%2f"
Upvotes: 2