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路由重定向到錯誤的網址

回答

相關問題