Question

我阅读了堆栈溢出显示的所有提出的问题，但没有一个解决了我的问题。

我是Angular的新手，我有一对Modules和Components。我希望子模块导入组件。然后让父模块导入子模块并创建其组件。是的，我已在子模块中导出了该组件。

我想要这样：

父模块
- 子模块
  - 组件（玩具）

但是我得到了错误：

parent / parent.module.ts（8,5）中的错误：错误TS2304：找不到名称“ ToyComponent”。

我不明白为什么这不起作用。我希望对一些示例代码进行解释。谢谢！

这是相关代码：

玩具组件

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

@Component({
  selector: 'app-toy',
  templateUrl: './toy.component.html',
  styleUrls: ['./toy.component.css']
})
export class ToyComponent implements OnInit {

  constructor() { }

  ngOnInit() {
  }

}

玩具组件HTML

<p>
  Awesome toy!
</p>

子模块

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { ToyComponent } from './toy/toy.component';
import { ChildComponent } from './child.component';

@NgModule({
  declarations: [
    ToyComponent,
    ChildComponent
  ],
  imports: [
    CommonModule
  ],
  exports: [
    ToyComponent
  ]
})
export class ChildModule { }

父模块

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { ChildModule } from './child/child.module';
import { ParentComponent } from './parent.component';

@NgModule({
  declarations: [
    ToyComponent,
    ParentComponent
  ],
  imports: [
    ChildModule,
    CommonModule
  ],
  exports: [
  ]
})
export class ParentModule { }

父组件HTML

<p>
  parent works! Child: Toy: <app-toy></app-toy>
</p>

Answer 1

修复：
1.从ToyComponent的声明和导出中删除ParentModule。
2.在您的ToyComponent中声明Child Module并将其导出。
3.将ChildModule作为导入添加到您的父模块。

原因：
您的ToyComponent在您的ChildModule下声明。由于您在ToyComponent中使用ParentModule，因此需要从ToyComponent导出ChildModule。并将ChildModule导入您的ParentModule。

Answer 2

问题

ToyComponent中似乎缺少ParentModule的import语句，这会导致错误。

修复

自ToyComponent被添加到exports中的ChildModule以来，它必须 ParentModule
从以下位置删除ToyComponent： declarations中的ParentModule-列表

ToyComponent知道ParentModule，因为ChildModule已添加到imports-列表中。

Angular 7-从导入的模块获取组件

我阅读了堆栈溢出显示的所有提出的问题，但没有一个解决了我的问题。

2 个答案: