1

我正在尝试在 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: '/' });

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

4

3 回答 3

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;
   }
于 2015-06-27T10:10:56.220 回答
1

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

于 2015-09-08T16:14:54.013 回答
0
$locationProvider.hashPrefix('!')

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

于 2013-09-17T11:04:24.610 回答