帶有Express的角度UI路由器

Question

我已將ui路由器設置為以下狀態：

$locationProvider.html5Mode(true);
$urlRouterProvider.otherwise('/');

$stateProvider
.state('adminprojects', {
    url: '/adminprojects',
    templateUrl: 'views/adminProjects.html',
    controller: 'adminProjectsCtrl'
})
.state('adminprojectsdetails', {
    url: '/adminprojects/:id',
    templateUrl: 'views/adminProjectsDetails.html',
    controller: 'adminProjectsDetailsCtrl'
})

adminprojects視圖包含帶有ui-sref鏈接的列表。 例如

<li><a ui-sref="adminprojectsdetails({id: project.id})" href="/adminprojects/1">Project 1</a></li>

如果我單擊此鏈接（例如adminprojects / 1），則adminProjectsDetails.html視圖將正確顯示。 但是，如果我刷新此頁面或直接導航到該URL，則不會加載該視圖。

但是，如果我將html5模式設置為false，這將按預期工作；

快遞我有這個

router.get('/*', function(req, res) {
  res.sendfile(__dirname + '/public/index.html');
});

控制器現在只是樣板：

angular.module('jhApp')
.controller('adminProjectsCtrl', function($scope, projects) {
    $scope.projects = projects.items;
});

和

angular.module('jhApp')
.controller('adminProjectsDetailsCtrl', function($scope, $stateParams) {
    console.log($stateParams);
});

任何想法為什么這不起作用？

Answer 1

您是否創建了生成器角度的項目？

如果是這樣，請將<base href="/"/>放在HEAD內的所有其他元素上方。

生成器使用src文件夾的相對路徑創建index.html，如：

<script src="xxx/yyy.js"/>

刷新頁面時，瀏覽器將查找未找到的/adminprojects/xxx/yyy.js（.css，*）文件。 因此，您可能會遇到許多腳本和樣式錯誤。 使用基本標簽可解決該問題。

或者只需將所有src位置更改為“ xxx / yyy。 ”-> src =“ / xxx / yyy。 ”