角2路由器直接访问URL

Question

我有我main.component.ts代码：
它的位置是：root/

import {Component, OnInit, OnChanges, IterableDiffers} from 'angular2/core'; 
import {TypeService} from './type/type.service'; 
import {RouteConfig, ROUTER_DIRECTIVES} from 'angular2/router'; 
import {Router} from 'angular2/router'; 

@Component({ 
    selector: 'my-app', 
    providers: [], 
    directives: [ROUTER_DIRECTIVES], 
    template: ` 
     <a [routerLink]="['Type']">Type</a> 
     <router-outlet></router-outlet> 
    ` 
}) 

@RouteConfig([ 
    {path:'/type', name: 'Type', component: TypeService} 
]) 

export class AppComponent{ 
    constructor(private _router: Router){} 
} 

然后，我有我的type.component.ts代码：
它的位置是：root/type

import {Component, OnInit} from 'angular2/core'; 
import {DirectoryComponent} from '../main/main.component'; 
import {RouteConfig, ROUTER_DIRECTIVES} from 'angular2/router'; 
import {Router} from 'angular2/router'; 
import {AppComponent} from '../app.component'; 
import {Http} from 'angular2/http'; 

@Component({ 
    selector: 'type', 
    directives: [ROUTER_DIRECTIVES], 
    template: `<h1>hi</h1>` 
}) 

export class TypeService{ 

    constructor(
    private _router: Router) {} 
    } 

当我点击我的主应用程序中的类型链接时，我需要root/type并加载类型组件。但是，如果我按下重新加载它给我一个未找到错误。

我该怎么做才能直接通过url访问组件？

Answer 1

如果找不到请求的URL，则需要配置服务器以便为主文件（通常为index.html）提供服务。根据你使用的服务器，它可能是.htaccess文件，中间件，路由配置等有很多类似的问题，所以试图找到你的具体情况的答案...

Answer 2

我用HashLocationStrategy来解决它。

https://angular.io/docs/ts/latest/api/router/HashLocationStrategy-class.html

在main.ts：

import {bootstrap} from 'angular2/platform/browser' 
import {AppComponent} from './app.component' 
import {HTTP_PROVIDERS} from 'angular2/http'; 
import {ROUTER_PROVIDERS, 
    LocationStrategy, 
    HashLocationStrategy} from 'angular2/router'; 
import {provide} from 'angular2/core'; 

bootstrap(AppComponent, [ 
    HTTP_PROVIDERS, 
    ROUTER_PROVIDERS, 
    provide(LocationStrategy, {useClass: HashLocationStrategy}) 
]); 

然后去根/＃/键入它带我到我喜欢的类型组件。