6
Tôi đã thiết lập định tuyến ở góc hoạt động hoàn toàn chính xác trong ứng dụng, tuy nhiên nếu tôi điều hướng đến trang giới thiệu của mình, ví dụ: http://localhost:9000/about và làm mới trang tôi gặp lỗi nói số "Cannot GET /about". nếu tôi mở một tab mới và dán url vào đó và truy cập trang.Không thể nhận/lỗi định tuyến trang góc 2
My boot.ts tập tin định tuyến containint Logic
// -- Typescript typings -------------------------------------------------------
/// <reference path="../typings/jquery.d.ts" />
/// <reference path="../typings/jqueryui.d.ts" />
//Imports ----------------------------------------------------------------------
import {Component, enableProdMode} from 'angular2/core';
import {bootstrap} from 'angular2/platform/browser';
import {
ROUTER_DIRECTIVES,
ROUTER_PROVIDERS,
Router,
RouteConfig,
} from 'angular2/router';
// -- Application Imports ------------------------------------------------------
import {NavbarComponent} from './components/navbar.component';
import {HomePage} from './pages/home.page';
// -- Enable production module -------------------------------------------------
enableProdMode();
// -- Component ----------------------------------------------------------------
@Component({
selector: 'main-app',
directives: [ ROUTER_DIRECTIVES, NavbarComponent ],
template: `
<app-navbar></app-navbar>
<router-outlet></router-outlet>
`
})
// -- Routing ------------------------------------------------------------------
@RouteConfig([
{ path: '/', name: 'root', redirectTo: ['/Home'] },
{ path: '/home', name: 'Home', component: HomePage }
])
// -- Class --------------------------------------------------------------------
export class MainApp {
constructor(public router: Router) {}
}
// -- Bootstrap for application ------------------------------------------------
bootstrap(MainApp, [
ROUTER_PROVIDERS
]);
file index.html
<!doctype html>
<html lang="en">
<head>
<base href="/">
<meta charset="UTF-8">
<title>Angular2 starter</title>
<!-- Application css -->
<link href="dist/libraries/bundle.css" rel="stylesheet"></link>
<link href="dist/styles/main.css" rel="stylesheet"></link>
</head>
<body>
<main-app>Loading...</main-app>
<!-- Application js -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script src="dist/libraries/bundle.js"></script>
</body>
<!-- ES6-related imports -->
<script src="/node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="/node_modules/es6-shim/es6-shim.min.js"></script>
<script src="/node_modules/systemjs/dist/system.js"></script>
<script>
//configure system loader
System.config({defaultJSExtensions: true});
</script>
<script src="/node_modules/rxjs/bundles/Rx.js"></script>
<script src="/node_modules/angular2/bundles/angular2.min.js"></script>
<script>
//bootstrap the Angular2 application
System.import('dist/app/boot').catch(console.log.bind(console));
</script>
</html>
và dự án kết cấu
dist/
app/
components/
navbar.component.js
pages/
home.page.js
boot.js
assets/
typings/
src/
... original files that are compiled into dist here
index.html
Xem: http://stackoverflow.com/questions/34541532/is-angular-2s-router-broken-when-using-html5-routes – Langley