AngularJS HTML5嵌套路由

时间:2013-06-17 18:34:08

标签: html5 url angularjs

Angular:1.1.5

我转到:http://xxxxx.com/route1/route2/route3/route3被触发而不是route1/route2/route3 适用于HTML5模式关闭...... :(

Nginx配置

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

我的应用配置

$routeProvider.when('/route1/route2/route3', {
        templateUrl: '/views/home.html',
        controller: 'HomeCtrl'
    });

$routeProvider.when('/route3', {
        templateUrl: '/views/home.html',
        controller: 'HomeCtrl'
    });

$locationProvider.hashPrefix('!');
$locationProvider.html5Mode(true);

$location日志:

$$protocol: "http", $$host: "xxxxxx"…}
$$absUrl: "http://xxxxxxx.com/route1/route2/route3"
$$hash: ""
$$host: "10.44.11.73"
$$path: "/route3"
$$port: 80
$$protocol: "http"
$$replace: false
$$url: "/route3"

如何更改设置以使HTML5网址使用嵌套路由?

2 个答案:

答案 0 :(得分:3)

对于单页应用,这是您在NGINX配置中所需的全部内容:

server
{
    server_name example.com *.example.com;
    access_log /var/log/nginx/example.com.access.log;
    error_log /var/log/nginx/example.com.error.log;
    root /var/www/html/example;
    index index.html;
    location / {
       try_files $uri /index.html;
    }
}

答案 1 :(得分:3)

添加

<base href="/">

index.html