Angular 无法识别新组件

Question

我是 Angular 新手，我正在创建我的第一个英雄应用之旅（每个人都这样做）。但问题是角度无法识别新组件。就像它没有给出任何错误而不是在浏览器中呈现一样

更新：好的，我再次像 Wahab Shah 一样为我的应用程序提供服务，但这次是从 VS 代码终端而不是 Windows 终端，它现在可以工作了。非常感谢您的帮助

heroes.component.html

<h2>{{hero.name | uppercase}} Details</h2>
<div><span>id: </span>{{hero.id}}</div>
<div>
    <label>name:
    <input [(ngModel)]="hero.name" placeholder="name"/>
  </label>
</div>

heroes.component.ts

import { Component, OnInit } from '@angular/core';
import { Hero } from '../hero';

@Component({
  selector: 'app-heroes',
  templateUrl: './heroes.component.html',
  styleUrls: ['./heroes.component.css']
})
export class HeroesComponent implements OnInit {
  hero: Hero = {
    id: 1,
    name: 'Windstorm'
  };

  constructor() { }

  ngOnInit() {
  }

}

app-routing.module.ts

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


const routes: Routes = [];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

app.component.html

<h1>{{title}}</h1>
<app-heroes></app-heroes>

app.component.ts

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

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'Tour of Heroes';

}

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms'; // <-- NgModel lives here

import { AppComponent } from './app.component';
import { HeroesComponent } from './heroes/heroes.component';

@NgModule({
  declarations: [
    AppComponent,
    HeroesComponent
  ],
  imports: [
    BrowserModule,
    FormsModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

hero.ts

export interface Hero {
  id: number;
  name: string;
}

Answer 1

ng 再次为您的应用提供服务，或者如果是这种情况，则在其父组件中使用您新创建的组件的选择器。

大多数情况下，在添加新组件或模块后，应用程序不会呈现它。只需重新服务即可。

Answer 2

问题可能是这样的，

1. 您尚未为该组件声明任何路由
2. 您尚未在 app.component.html 页面中添加该新组件的应用选择器。

其中任何一个都可能导致新组件无法在浏览器中呈现。