如何定制 Angular js 网址以使其用户友好?

Question

我们正在继续开发我们的网站，在前端使用AngularJS，在后端使用Yii 1.1。

我们的应用程序允许用户创建自己的社区组 当用户点击名为"ABC 组"的组(ID 为 9(时，网址为

http://ourwebsite.com/#/app/group/9/content/list

但是，我们希望将其更改为如下所示：

http://ourwebsite.com/abcgroup/

我们正在使用 UI 路由器

任何想法如何做到这一点？ 另外，为什么角度使用"#"？

Answer 1

你必须注入$locationProvider并将属性html5Modetrue设置为true，如下所示：

$locationProvider.html5Mode(true);

例如：-

angular.module('myModule', [])
.config(['$routeProvider', '$locationProvider', function($routeProvider, 
$locationProvider) {
$routeProvider.
when('/contact', {templateUrl: 'xyz/contact.html',   controller: mycontroller})
.otherwise({redirectTo: '/home.html'});
$locationProvider.html5Mode(true);

}](;

即使你可以在这里查看答案

如果您使用的是UI路由器，则可以对$stateProvider执行相同的操作

angular.module('myModule', [])
.config(['$stateProvider', '$locationProvider', function($stateProvider, 
$locationProvider) {
$stateProvider
.state("contact",
{
url: "xyz/contact",
views: {
'content': {
templateUrl: "Views/xyz/contact.html",
controller: "contactController"
}
}
})
$locationProvider.html5Mode(true);
]);