私はangular2を、angular websiteという簡単なプロジェクトを実行して学習しています。依存関係はnpmを使用してインストールされ、チュートリアルのようにlite-serverがパブリッシングに使用されます。Angular2:jsファイルとcssファイルをフェッチしていないルーティングされたモジュールを再ロード
1つのアプリケーションモジュール内のすべてをルーティングモジュールとともにコーディングします。ルーティングは
RouterModule.forRoot([
{
path: 'dashboard',
component: DashboardComponent,
children: [
{ path: 'profile', component: ProfileComponent },
{ path: 'transaction', component: TransactionFormComponent },
{ path: '', redirectTo: 'transaction', pathMatch: 'full' }
]
},
{ path: 'login', component: LoginFormComponent },
{ path: '', redirectTo: 'login', pathMatch: 'full' }
])
main.ts
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app.module';
const platform = platformBrowserDynamic();
platform.bootstrapModule(AppModule)
.then(success => console.log(`Bootstrap success`))
.catch(err => console.error(err));
app.module.ts
@NgModule({
imports: [ BrowserModule, FormsModule, HttpModule, AppRoutingModule ],
declarations: [ AppComponent, LoginFormComponent, DashboardComponent,
ProfileComponent, TransactionFormComponent ],
bootstrap: [ AppComponent ]
})
export class AppModule { }
index.htmlを
として構成されていますすべてが正常に動作します:
はlocalhost:3000の負荷が(:3000 /ダッシュボード/トランザクション今すぐブラウザ URL]タブには、ローカルホストを示して)デフォルトで
成功したログイン負荷トランザクションコンポーネントページにログイン
ビューはstyle.css内のスタイルでレンダリングされます。
プロファイルコンポーネントに移動できます。ローカルホストをリロードオン
:除き
3000 /ダッシュボード/トランザクションページブラウザのリロードボタンをクリックすることで、それは "ロード..." を示しています。 3000 /ダッシュボード/ ..正確な場所ではありません。ブラウザのコンソールには、私はlocalhostの参照エラー
GET
http://localhost:3000/dashboard/node_modules/core-js/client/shim.min.js [HTTP/1.1 404 Not Found 1ms]
GET
http://localhost:3000/dashboard/node_modules/zone.js/dist/zone.js [HTTP/1.1 404 Not Found 17ms]
GET
http://localhost:3000/dashboard/node_modules/systemjs/dist/system.src.js [HTTP/1.1 404 Not Found 12ms]
GET
http://localhost:3000/dashboard/systemjs.config.js [HTTP/1.1 404 Not Found 12ms]
GET
http://localhost:3000/dashboard/node_modules/bootstrap/dist/css/bootstrap.min.css [HTTP/1.1 404 Not Found 13ms]
GET
http://localhost:3000/dashboard/style.css [HTTP/1.1 404 Not Found 13ms]
GET
http://localhost:3000/dashboard/node_modules/systemjs/dist/system.src.js [HTTP/1.1 404 Not Found 2ms]
GET
http://localhost:3000/dashboard/systemjs.config.js [HTTP/1.1 404 Not Found 0ms]
ReferenceError: System is not defined
を示しています。
これはどうしてですか?
解決策は何ですか?
今後の研究では、ページを読み込まないで多くのシナリオを満たしています。私はページが私のためにロードされていると思うが、jsとcssファイルはロードしていないと思う。したがって、Systemjsファイルもありません。そのため、ページはレンダリングされません。
thisとも呼ばれます。
注:あなたは、ブラウザが上から下に読み込むので、index.html
にスクリプトとリンクタグの上ご<base href="/">
を配置する必要がありで<base href="/">
index.htmlを
' を' script'タグの上に置き、単純に動作させます。ありがとう@PierreDuc –