我有一个网站,目前有这样的 URL
http://www.bruxzir.com/cases-bruxzir-zirconia-dental-crown/
我正在评估 Angular 并且到目前为止已经开始使用 angular-seed 的应用程序.但现在我的 URL 看起来像这样
http://localhost:8000/index.html#/cases-bruxzir-zirconia-dental-crown/
我已经将 meteor 用于 SPA,并且具有兼容的 URL 结构。那么我怎样才能用 Angular 做到这一点呢?基本上从 URL 中删除 index.html#
。这是我的代码。
index.html - 标题中的链接
<li><a href="#/cases-bruxzir-zirconia-dental-crown/">Cases</a></li>
app.js
'use strict';
// Declare app level module which depends on filters, and services
angular.module('myApp', [
'ngRoute',
'myApp.filters',
'myApp.services',
'myApp.directives',
'myApp.controllers'
]).
config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/', {templateUrl: 'partials/home.html', controller: 'home'});
$routeProvider.when('/features-bruxzir-zirconia-dental-crown/', {templateUrl: 'partials/features.html', controller: 'features'});
$routeProvider.when('/science-bruxzir-zirconia-dental-crown/', {templateUrl: 'partials/science.html', controller: 'science'});
$routeProvider.when('/video-bruxzir-zirconia-dental-crown/', {templateUrl: 'partials/videos.html', controller: 'videos'});
$routeProvider.when('/cases-bruxzir-zirconia-dental-crown/', {templateUrl: 'partials/cases.html', controller: 'cases'});
$routeProvider.when('/testimonials-bruxzir-zirconia-dental-crown/', {templateUrl: 'partials/testimonials.html', controller: 'testimonials'});
$routeProvider.when('/authorized-bruxzir-labs-zirconia-dental-crown/', {templateUrl: 'partials/labs.html', controller: 'labs'});
$routeProvider.otherwise({redirectTo: '/home'});
}]);
最佳答案
只需使用 HTML5 mode由 $locationProvider
提供:
angular.module('myApp', [
'ngRoute',
'myApp.filters',
'myApp.services',
'myApp.directives',
'myApp.controllers'
]).
config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
$locationProvider.html5Mode(true); //adding this line
$routeProvider.when('/', {templateUrl: 'partials/home.html', controller: 'home'});
$routeProvider.when('/features-bruxzir-zirconia-dental-crown/', {templateUrl: 'partials/features.html', controller: 'features'});
$routeProvider.when('/science-bruxzir-zirconia-dental-crown/', {templateUrl: 'partials/science.html', controller: 'science'});
$routeProvider.when('/video-bruxzir-zirconia-dental-crown/', {templateUrl: 'partials/videos.html', controller: 'videos'});
$routeProvider.when('/cases-bruxzir-zirconia-dental-crown/', {templateUrl: 'partials/cases.html', controller: 'cases'});
$routeProvider.when('/testimonials-bruxzir-zirconia-dental-crown/', {templateUrl: 'partials/testimonials.html', controller: 'testimonials'});
$routeProvider.when('/authorized-bruxzir-labs-zirconia-dental-crown/', {templateUrl: 'partials/labs.html', controller: 'labs'});
$routeProvider.otherwise({redirectTo: '/home'});
}]);
关于javascript - 如何通过删除 "#"使 Angular URL 变得更清晰?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20749332/