Question

我的网站目前有这样的网址

http://www.bruxzir.com/cases-bruxzir-zirconia-dental-crown/

我正在评估角度，到目前为止已经开始使用angular-seed的应用。但现在我的网址看起来像这样

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'});
}]);

Answer 1

只需使用$locationProvider提供的HTML5 mode：

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'});
}]);

如何通过删除“＃”使Angular URL变得更干净？

1 个答案: