Question

角度。当组件包含子组件时，如何在NgModule中声明组件？

这个例子

app.module.ts：

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

import { AppComponent }  from './app.component';
import { NavbarComponent } from './components/navbar/navbar.component';
import { TrackComponent } from './components/track/track.component';

@NgModule({
imports:      [ BrowserModule ],
declarations: [ AppComponent, NavbarComponent, TrackComponent],
bootstrap:    [ AppComponent ]
})
export class AppModule { }

TrackComponent包含3个子组件：

import {Component} from '@angular/core';
import {SkillComponent} from './skill-level/skilllevel.component';
import {TrackheaderComponent} from './header/trackheader.component';

@Component({
moduleId: module.id,
selector: 'trackelement',
templateUrl: 'track.component.html'
})

export class TrackComponent {
private title: string;

constructor() {
    this.title = 'title';
  }
}

我正在使用angular-cli（ng用于本地测试），但是控制台（和我的IDE）说TrackComponent还没有在任何NgModule中声明。

我尝试了几件事：

在app.module.ts中声明所有子组件。
在导出组件的TrackComponent.ts中创建新的NgModule。

所以我的问题更精确：这样做的正确方法是什么？ - 拥有一棵树的正确方法＆＃39;组件。我试图遵循良好做法。

Answer 1

没有理由导入像这样的组件

import {SkillComponent} from './skill-level/skilllevel.component';
import {TrackheaderComponent} from './header/trackheader.component';

除非你以其他方式实际使用这些课程。

如果你假设TrackComponent使用这些组件的事实，那么你需要在TrackComponent中导入它们，那你就错了。

除此之外，您通常会在根应用程序模块中声明组件，除非您特别希望它们作为模块分离为整个实体，在这种情况下，您需要创建另一个模块，声明并导出该模块中的那些组件，并将该模块导入根模块。

当组件包含子组件时，如何在NgModule中声明组件？

1 个答案: