Angular2/pageリソースを読み込めませんでした：ステータス404

Question

pls help me。私はなぜそれが動作しないのか分からない。なぜサーバーが私にこのステータスを送るのですか？何が間違っているのですか？このコードで何が問題になっていますか？面白いのは、私はこのページに行くことができますが、私はこのエラーが表示されます - 私はこのエラーが表示されますf12を押すとき - >リソースを読み込めませんでした：サーバーが404の状態（見つかりません）で応答しましたhttp://localhost:8080/registration これは私のとても簡単ですコード。

app.ts

import { RouterModule, Routes } from '@angular/router'; 

import { RegistrationComponent } from './components/registration.component'; 

const APP_ROUTES: Routes = [ 
    { path: '', redirectTo: '/registration', pathMatch: 'full' }, 
    { path: 'registration', component: RegistrationComponent } 
]; 

export const routing = RouterModule.forRoot(APP_ROUTES); 

route.component.ts

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

@Component({ 
    selector: 'root-component', 
    template: ` 
    <router-outlet></router-outlet> 
    ` 
}) 

export class RootComponent { 

} 

Answer 1

は、おそらくあなたはメカニズムを書き換えるウェブサーバを必要とし

import './sass/style.scss' 
import 'reflect-metadata' 
import 'zone.js/dist/zone.min.js'; 
import { Component, NgModule } from '@angular/core'; 
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic' 
import { BrowserModule } from '@angular/platform-browser'; 
import { RootComponent } from './components/root.component'; 
import { RegistrationComponent } from './components/registration.component'; 
import { routing } from './app.routing'; 

@NgModule({ 
    declarations: [ 
     RootComponent, 
     RegistrationComponent 
    ], 
    imports: [ 
    BrowserModule, 
    routing 
    ], 
    providers: [], 
    bootstrap: [RootComponent] 
    }) 

    export class AppModule {} 

    platformBrowserDynamic().bootstrapModule(AppModule); 

app.routing.ts：角度は何を知っています/registrationとしてください。ただし、ウェブサーバーでは表示されません。つまり、存在しないファイルへのリクエストをAngular（つまりindex.html）に渡すようにWebサーバーを設定する必要があります（またはAng2の開始点は何でも構いません）。また

FallbackResource /index.html 

（またはあなたがこのようなものをサポートしていないサーバを使用している場合）、あなたは角度のHashLocationStrategyに切り替えることができます：Apacheを使用想定

、行うための最も簡単な事があります。

Answer 2

私はそれを修正しました。私はルーティングに{ useHash: true}を追加しなければならなかった。

export const routing = RouterModule.forRoot(APP_ROUTES, { useHash: true}); 

今では動作します：D