Angular 2 不会从 AppComponent 移动到起始页面答案

【问题标题】：Angular 2 does not move to start page from AppComponentAngular 2 不会从 AppComponent 移动到起始页面
【发布时间】：2017-12-01 19:32:15
【问题描述】：

我正在尝试学习 Angular 2 并立即使用它。但我不知道为什么它没有从 AppComponent 进入起始页面。据我所知，这必须移动到测试页面并显示“测试”文本。但是当我运行它时，它只显示“Hello”，这是 app.component 文本。如果我输入 /test url，就会出现 404 错误。是不是因为测试组件没有加载成功？

main.ts

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { AppModule } from './app/app.module';
 platformBrowserDynamic().bootstrapModule(AppModule);

app.module.ts

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { routing } from './app.routing';
import { test } from './test';
@NgModule({
    imports: [
        BrowserModule,
        routing
    ],
    declarations: [
        AppComponent,
        test
    ],
    providers: [
    ],
    bootstrap:    [ AppComponent ]
})
export class AppModule { }

app.routing.ts

 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
 import { test } from './test.index';
 const routes: Routes = [
     { path: '', component: test },
     { path: 'test', component: test },
     { path: '**', redirectTo: '' },
 ];

 export const routing = RouterModule.forRoot(routes);

app.component.ts

  import { Component } from '@angular/core';
    @Component({
      selector: 'my-app',
      template: `<h1>Hello </h1>`,
    })
    export class AppComponent  {  }

test.ts

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

@Component({
    selector: 'test-app',
    template: `<h1>test </h1>`,
})
export class test {}

【问题讨论】：

..深入文档：angular.io/tutorial/toh-pt5 你的router-outlet 在哪里？ :)
该死 - 打败我 :)！

标签： javascript angular web

【解决方案1】：

在您的应用组件模板中包含“<router-outlet></router-outlet>”：

 <div>
      <h3>App component</h3>
    </div>
    <div>
      <router-outlet></router-outlet>
    </div>

【讨论】：

【解决方案2】：

您似乎需要在app.component.ts 模板中提供<router-outlet></router-outlet>。

所以测试组件没有被加载，因为没有<router-outlet>，它无法将组件注入任何东西。

https://angular.io/tutorial/toh-pt5#add-routeroutlet

【讨论】：