Question

我正在学习Angular（7），并且有一个问题。我的程序具有以下结构：

app.component
- Component A
- - Component A.1

因此，组件A.1是A的子组件。组件A文件夹位于app文件夹内，而组件A.1文件夹位于组件A文件夹内。我将A.1组件名称放在A的“声明”中，而不放在app.component的声明中。因此，我得到“模板解析错误名称不是已知元素。

当我还将组件A.1也放入app.component的声明中时，该应用程序可以工作并且不会发生错误。

为什么我必须在app.component中也声明A.1组件？

我认为将声明放入父组件中就足够了。

app.module

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

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { CustomersComponent } from './customers/customers.component';
//import { CustomersListComponent } from './customers/customers-list/customers-list.component';

@NgModule({
  declarations: [
    AppComponent,
    CustomersComponent,
//      CustomersListComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
        CustomersComponent
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

一个模块

import { NgModule }      from '@angular/core';
import { CommonModule } from '@angular/common';

import { CustomersComponent }  from './customers.component';
import { CustomersListComponent } from './customers-list/customers-list.component';

@NgModule({
    imports:      [ CommonModule ],
    declarations: [ CustomersComponent, CustomersListComponent ],
    exports: [ CustomersComponent, CustomersListComponent ]
})
export class CustomersModule { }

Answer 1

在您的组件A模块中添加如下内容

 declarations: [Component A.1],
....
 exports: [Component A.1]

希望是有帮助的

更新：

从声明中删除 CustomersComponent

并将 CustomersModule 添加到应用模块中的导入

Answer 2

一个组件必须属于NgModule，以便它可用于另一个组件或应用程序。要使其成为NgModule的成员，请在NgModule元数据的声明字段中列出它。 officiel documentation about component

您必须将组件的声明放入模块中，并且只能声明一次。

Answer 3

在客户模块中：

declarations: [ CustomersComponent, CustomersListComponent ],
exports: [ CustomersComponent, CustomersListComponent ]

在AppModule中

imports: [CustomersModule]

请注意，在导入数组中，您必须指定仅模块，而不是组件。

在哪里声明子组件？

3 个答案: