javascript - 角删除哈希符号

Question

我正在尝试在 angularJS 中为 webapps 创建一个目录结构，我现在的问题是我使用 $routeProvider，这在链接中添加了一个井号 (#)。我试过这个功能

$locationProvider.html5Mode(true);

但是在我使用 thyis 函数之后，routeProvider 不再工作，它不会在它应该加载的地方加载任何 ng-view。这是我的路线提供者

$routeProvider
            .when('/', { templateUrl: '/view/home.html' })
            .when('/blog', { templateUrl: '/view/blog.html' })
            .when('/contact', { templateUrl: '/view/contact.html' })
            .otherwise({ redirectTo: '/' });

是否有另一种方法可以删除哈希并使应用程序不是单页应用程序？谢谢你，丹尼尔。

Answer 1

从 Angular 项目中的 Url 中删除 #。

http://localhost/#/about ---> http://localhost/about

1) 在 index.html 中添加基本 url

2) 在您的 app.js 或 routes.js 中使用 html5 历史记录

if(window.history && window.history.pushState){
    $locationProvider.html5Mode(true);
}

3）服务器端配置——Grunt Server: middleware: function (connect) { var middlewares = []; middlewares.push(modRewrite([ '!/assets|\.html|\.js|\.css|\woff|\ttf|\swf$ /index.html' ]));

    middlewares.push(connect.static('.tmp'));
    middlewares.push(connect().use(
      '/bower_components',
      connect.static('./bower_components')
    ));
    middlewares.push(connect.static(appConfig.app));

    //middlewares.push(require('grunt-connect-proxy/lib/utils').proxyRequest);
    return middlewares;
  }

  -Ngnix Server  
  location ~ ^/(scripts.*js|styles|images) {
        gzip_static on;
        expires 1y;
        add_header Cache-Control public;
        add_header ETag "";
        break;
    }

   #location /api1 {
   #  rewrite ^/api1/(.*) /$1 break;
   #  proxy_redirect off;
   #  proxy_pass https://api1.example.com;
   #  proxy_set_header X-Real-IP $remote_addr;
   #  proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
   #  proxy_set_header X-Forwarded-Proto https;
   #  proxy_set_header Authorization $http_authorization;
   #}

   #location /api2 {
   #  rewrite ^/api2/(.*) /$1 break;
   #  proxy_redirect off;
   #  proxy_pass https://api2.example.com;
   #  proxy_set_header X-Real-IP $remote_addr;
   #  proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
   #  proxy_set_header X-Forwarded-Proto https;
   #  proxy_set_header Authorization $http_authorization;
   #}

   location / {
     try_files $uri /index.html;
   }

Answer 2

您需要在路由文件中，就像您所做的那样： $locationProvider.html5Mode(true); 并且您必须在头中添加到索引文件中： <base href="/">

Answer 3

$locationProvider.hashPrefix('!')

现在你可以不使用“/home”之类的链接#（仅适用于 html5 浏览器）