Angular2路由重定向到错误的网址

我在apache服务器上的子文件夹/draft中有一个angular2应用程序。为了得到它的工作我在/草案增加这个.htaccess：Angular2路由重定向到错误的网址

Options Indexes FollowSymLinks 

RewriteRule ^index\.html$ - [L] 
RewriteCond %{REQUEST_FILENAME} !-f 
RewriteCond %{REQUEST_FILENAME} !-d 
RewriteRule . /draft/index.html [L]

而且在头部添加到了/draft/index.html：

<base href="draft/">

我的组件和其他打字稿文件在/草案/应用/，我/draft/systemjs.config.js看起来是这样的：

(function (global) { 
    System.config({ 
    paths: { 
     'npm:': '/draft/node_modules/' 
    }, 
    map: { 
     app: '/draft/app', 
     '@angular/core': 'npm:@angular/core/bundles/core.umd.js', 
     'rxjs': 'npm:rxjs', 
     // ... 
    }, 
    packages: { 
     app: { 
     main: './main.js', 
     defaultExtension: 'js' 
     }, 
     rxjs: { 
     defaultExtension: 'js' 
     } 
    } 
    }); 
})(this);

这一切工作正常，但磨片ñ我尝试添加路由出错。当用户转到/draft/foo时，我想要显示组件FooComponent。
但是，当用户去/draft/foo，FooComponent显示为预期，但由于某种原因该网址更改为/draft/draft/draft/foo。

这是我/draft/app/app.routing.js：

// ... 
const appRoutes: Routes = [ 
    { 
     path: 'draft/foo', 
     component: FooComponent 
    } 
]; 

export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);

我添加了路由常量我的AppModule的进口阵列，/draft/app/app.module.ts：

// ... 
@NgModule({ 
    imports:  [ BrowserModule, HttpModule, routing ], 
    declarations: [ AppComponent, FooComponent ], 
    bootstrap: [ AppComponent ] 
}) 
export class AppModule { }

/draft/app/components/AppComponent.ts看起来是这样的：

import {Component} from '@angular/core'; 

@Component({ 
    selector: 'my-app', 
    template: '<router-outlet></router-outlet>' 
}) 
export class AppComponent {}

那么为什么/draft/foo重定向到/draft/draft/draft/foo，我能做些什么来阻止它？

来源

2016-09-20 Bram Meerten

显然该基地是不正确的。以下基础一切正常。

<base href="http://localhost/draft/" />

为了让更多的动态我这个替代它：

<script> 
    document.write('<base href="' + document.location + '" />'); 
</script>

但是当使用这只能在hash location strategy，否则路由路径总是'。所以我最终使用了以下内容：

<script> 
    document.write('<base href="' + document.location.protocol + '//' + document.location.host + '/draft/' + '" />'); 
</script>

来源

2016-09-26 19:24:13

Angular2路由重定向到错误的网址

回答

相关问题