AngularJs2路由

时间:2016-01-05 11:30:59

标签: angular

我的目标是 网站加载时路由到登录页面。 通过更换login-outlet登录show主页后 我怎么能用angularjs2

做到这一点

这是我在app.components.ts上的代码

import {Component} from 'angular2/core';
import {RouteConfig, ROUTER_DIRECTIVES} from 'angular2/router';
import {LoginComponent} from './login/login.component';
import {HomeComponent} from './home/home.component';
@Component({
    selector: 'my-app',
    template:   '<router-outlet></router-outlet>',
    directives: [ROUTER_DIRECTIVES] 
})
@RouteConfig([
    {path: '/login', name: 'Login', component: LoginComponent, useAsDefault: true},
    {path: '/home', name: 'Home', component: HomeComponent}
    ])
export class AppComponent { }

我的index.html

<html>

  <head>
    <title>Basic</title>

    <script>document.write('<base href="' + document.location + '" />');</script>
    <!-- 1. Load libraries -->
    <script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
    <script src="node_modules/systemjs/dist/system.src.js"></script>
    <script src="node_modules/rxjs/bundles/Rx.js"></script>
    <script src="node_modules/angular2/bundles/angular2.dev.js"></script>
    <!-- Router -->
    <script src="node_modules/angular2/bundles/router.dev.js"></script>

    <!-- 2. Configure SystemJS -->
    <script>
      System.config({
        packages: {        
          app: {
            format: 'register',
            defaultExtension: 'js'
          }
        }
      });
      System.import('app/boot')
            .then(null, console.error.bind(console));
    </script>

  </head>

  <!-- 3. Display the application -->
  <body>
    <my-app>Loading...</my-app>
  </body>

</html>

但是当我刷新页面时,网址就像是一样倍增 http://localhost:3000/login http://localhost:3000/login/login

1 个答案:

答案 0 :(得分:1)

如果您是本地开发人员,我认为您应该将<script>document.write('<base href="' + document.location + '" />');</script>替换为<base href="/">