Angular2ルーティングが間違ったURLにリダイレクトする

Question

私はangle2アプリケーションをApacheサーバー上のサブフォルダ/draftに持っています。それは私が/ドラフトでこの.htaccessを追加した作業得るために ：

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/"> 

私のコンポーネントや他のtypescriptですファイルは/ドラフト/アプリであります/、 と私/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); 

このすべてはうまく動作しますが、WHE n私は何かが間違っている経路を追加しようとします。 ユーザーが/draft/fooに行くと、コンポーネントFooComponentが表示されます。
しかし、ユーザが/draft/fooに行くと、FooComponentが期待どおりに表示されますが、何らかの理由でURLが/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にルーティングのconstを追加しました：

// ... 
@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にリダイレクトされていますか？停止するにはどうすればよいですか？

Answer 1

明らかにベースが正しくありませんでした。 以下の基本はすべて機能します。

<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>