编码正斜杠后，AngularJS附加链接 -

Question

http://localhost/templateStore/app/#!/templates - 工作正常。

单击当前页面上的链接后，链接将转换为： http://localhost/templateStore/app/#!/templates#%2Ftemplates%2F1

这应该是： http://localhost/templateStore/app/#!/templates/1

详细信息按钮的链接定义 ：

`<a class="btn btn-primary btn-block" ng-href="#/templates/1">Details</a>` 

问题

正斜杠被编码为“ %2F ”，您可以看到Angular创建的URL附加了一个额外的“ /templates ”。

我使用的是UBUNTU 15.04

查看app.js和template.js的代码：

app.js

angular.module('templateStore', [
  'ngRoute',
  'templateStore.view1',
  'templateStore.view2',
  'templateStore.templates'
]).
config(['$locationProvider', '$routeProvider', function($locationProvider, $routeProvider) {
  $locationProvider.hashPrefix('!');

 $routeProvider.otherwise({redirectTo: '/templates'});
}]);

template.js

angular.module('templateStore.templates',['ngRoute'])

.config(['$routeProvider',function($routeProvider){
    $routeProvider.
        when('/templates',{
            templateUrl: 'templates/templates.html',
            controller: 'TemplateCtrl'
        }).
        when('/templates/:templateId',{
            templateUrl: 'templates/template-details.html',
            controller: 'TemplateDetailsCtrl',

        })

    }])

    .controller('TemplateCtrl',['$scope',function($scope){
        console.log('TemplateCtrl Init ');
        console.log($scope);
    }])
    .controller('TemplateDetailsCtrl',['$scope',function($scope){
        console.log('TemplateDetailsCtrl Init ');
        console.log($scope);
        alert('TemplateDetailsCtrl');
    }]);

请让我知道如何解决这个问题。

请参阅下面的屏幕截图

登陆页面

将鼠标悬停在详细信息按钮上时，请查看左下角的链接

查看单击详细信息按钮后发生的情况：

模板详细信息页面：当我们输入URL作为http://localhost/templateStore/app/#!/templates/1时可以查看

Answer 1

删除了$locationProvider.hashPrefix('!'); 它正在发挥作用。

config(['$locationProvider', '$routeProvider', function($locationProvider, $routeProvider) {
  $locationProvider.hashPrefix('!'); // deleted this line . 

 $routeProvider.otherwise({redirectTo: '/templates'});
}]);