Ubuntu 上的 AngularJS Angular-Route 更改路由 /#/ -> /#!/ 链接不起作用答案

【问题标题】：AngularJS Angular-Route on Ubuntu changing routes /#/ -> /#!/ links not workingUbuntu 上的 AngularJS Angular-Route 更改路由 /#/ -> /#!/ 链接不起作用
【发布时间】：2017-04-25 08:46:19
【问题描述】：

项目在本地运行良好。但是，在将其部署到 AWS Ubuntu 实例后，路由似乎无法正常工作。 www.lewisengelart.com/#/ 的主页以一声巨响加载为 www.lewisengelart.com/#!/ 如果您尝试链接，浏览器会尝试加载 www.lewisengelart.com/#!/#%2Fabout 而不是 www.lewisengelart.com/#/about.

再一次，这个项目在本地运行良好，我不知道是什么在 ubuntu 实例上绊倒了它。

以前有人遇到过这个问题吗？

这里是app.js，路由配置

var app = angular.module("App", ['ngRoute', 'ngAnimate']);

app.config(['$routeProvider', '$httpProvider', function($routeProvider, $httpProvider){
$httpProvider.interceptors.push(
    function($q, $location) {
    return {
        'responseError':function(rejection){
        if (rejection.status == 401){
            $location.url('/letmein');
        }
        return $q.reject(rejection);
    }
    };
});
$routeProvider
    .when('/',{
        templateUrl: 'partials/dashboard.html'
    })
    .when('/text',{
        templateUrl: 'partials/text.html',
        controller: 'textCtrl'
    })
    .when('/magnet',{
        templateUrl: 'partials/magnet.html',
        // controller: 'magnetCtrl'
    })
    .when('/gauge',{
        templateUrl: 'partials/gauge.html',
        // controller: 'gaugeCtrl'
    })
    .when('/animation',{
        templateUrl: 'partials/animation.html',
        controller: 'animationCtrl as ACtrl'
    })
    .when('/about',{
        templateUrl: 'partials/about.html',
    })
    .when('/contact',{
        templateUrl: 'partials/Contact.html',
    })


    .when('/letmein',{
        templateUrl: 'partials/loginReg.html',
        controller: 'adminCtrl'
    })
    .when('/add',{
        templateUrl: 'partials/add.html',
        controller: 'workCtrl'
    })
    .otherwise({
        redirectTo: '/'
    });

}])

主页部分带有链接

<div class="indexHeader col-md-3">
 <a href="/#/"><h1>Lewis Engel</h1></a>

<div class="worksBox">
  <a ng-href="/#/about"><span class="colorFive">About</span></a>
  <a href="/#/contact"><span class="colorSix">Contact</span></a>

  <a href="/#/text"><span class="colorOne">Emergent Possibilities</span></a>
  <a href="/#/animation"><span class="colorTwo">Emergence over Time</span></a>
  <a href="/#/magnet"><span class="colorThree">Magnetic Attractions</span></a>
  <a href="/#/gauge"><span class="colorFour">Meaningless Measures</span></a>
</div>

【问题讨论】：

ahhh，我发现它与 angular、angular-route 和 angular-animate 版本有关。本地版本仍在运行 angular 1.5.8。虽然部署的版本获得了更新的 1.6.0。
问题已解决，以防万一其他人对此感到困惑。每个角度文档。 docs.angularjs.org/guide/migration#commit-aa077e8。必须添加 $locationProvider 和 $locationProvider.hashPrefix(''); -- 在 Angular 的更新版本中覆盖新协议。

标签： javascript angularjs ubuntu angular-routing

【解决方案1】：

每个角度文档。

docs.angularjs.org/guide/migration#commit-aa077e8。

必须添加

$locationProvider

和

appModule.config(['$locationProvider', function($locationProvider) {
  $locationProvider.hashPrefix('');
}]);

在 Angular 的更新版本中覆盖新协议。

【讨论】：