HashLocationStrategy не работает должным образом

Question

В настоящее время я работаю над проектом Angular2 с использованием TypeScript, и я не могу заставить HashLocationStrategy работать. Я переопределить LocationStrategy в самозагрузкой так, как это описано здесь: https://angular.io/docs/ts/latest/guide/router.html

import {bootstrap}   from 'angular2/platform/browser'; 
import {ROUTER_PROVIDERS} from 'angular2/router'; 
import {AppComponent}  from './app.component'; 
// Add these symbols to override the `LocationStrategy` 
import {provide}   from 'angular2/core'; 
import {LocationStrategy, 
     HashLocationStrategy} from 'angular2/router'; 
bootstrap(AppComponent, [ 
    ROUTER_PROVIDERS, 
    provide(LocationStrategy, 
     {useClass: HashLocationStrategy}) 
]); 

Я создал plunker, чтобы продемонстрировать мою проблему здесь: https://plnkr.co/edit/YE5w4iky53SHRi211lqX?p=preview

Кто-нибудь еще сталкивался этот вопрос? Разве я неправильно понял это или я что-то упускаю?

Редактировать: Ожидаемый результат будет заключаться в том, что маршрутизация использует хеши в URL-адресе. В примере, который должен создать такой URL: .../#/fubar, вместо этого я получаю .../fubar

Чтобы увидеть сгенерированные URL-адреса, вам нужно будет запустить плункер в отдельном окне (синий полноэкранная кнопка)

Answer 1

Пример не соответствует рекомендуемым рекомендациям по разбиению файлов для загрузочного и прикладного кода и немного запутанным в моих глазах.

Он отлично работает, если вы переместите HashLocation-код в ваш файл app.component:

app.ts

import [..] 

@Component({ 
    [..] 
    providers:[ 
     ROUTER_PROVIDERS, 
     provide(LocationStrategy, {useClass: HashLocationStrategy})] 
}) 
@RouteConfig([..]) 
    export class App{ 
     [..] 
    } 

boot.ts

import [..] 
[..] 
bootstrap(App); 

Take посмотрите на мою рабочую вилку вашего плунжера:
https://plnkr.co/edit/TNr8jQjiVmhADhWzbRsC?p=preview

Я просто догадываюсь, но причина может заключаться в том, что вы переписываете атрибут «providers» в AppComponent, как показано в примерах.

Answer 2

Вопрос и ответ основаны на бета-версии угловом 2. Вот рабочий пример Угловая 2,3: от официальных докторов https://angular.io/docs/ts/latest/guide/router.html#!#browser-url-styles

import { NgModule }    from '@angular/core'; 
import { BrowserModule }  from '@angular/platform-browser'; 
import { FormsModule }   from '@angular/forms'; 
import { Routes, RouterModule } from '@angular/router'; 

import { AppComponent }   from './app.component'; 
import { PageNotFoundComponent } from './not-found.component'; 

const routes: Routes = [ 

]; 

@NgModule({ 
    imports: [ 
    BrowserModule, 
    FormsModule, 
    RouterModule.forRoot(routes, { useHash: true }) // .../#/crisis-center/ 
    ], 
    declarations: [ 
    AppComponent, 
    PageNotFoundComponent 
    ], 
    providers: [ 

    ], 
    bootstrap: [ AppComponent ] 
}) 
export class AppModule { }