不能在Angular中导入我的自定义组件

Question

我是Angular的新手，在导入组件时遇到了一个问题。我声明了一个模块，在那里我得到了所有的组件，使用它作为一个共享组件模块我在侧边栏组件内使用输入组件，侧边栏组件在app模块上，工作得很好。问题是当我想在基页内使用输入组件时，我导入模块并使用html侧的标签，visual studio代码不警告我任何东西，但在编译时，控制台告诉我'app-input' is not a known element

在我的项目中，我有以下结构

App
|-pages
|--base
|
|-widgets
|--sidebar
|---sidebar.component.ts
|--input
|---input.component.ts
|--widgets.module.ts
|
|-app.module.ts

input.component.ts

import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-input',
templateUrl: './input.component.html',
styleUrls: ['./input.component.css']
})
export class InputComponent implements OnInit {
constructor() { }
ngOnInit(): void {
}
}

widgets.module.ts

import { NgModule } from '@angular/core';
import { HeaderComponent } from './header/header.component';
import { FooterComponent } from './footer/footer.component';
import { SidebarComponent } from './sidebar/sidebar.component';
import { InputComponent } from './input/input.component';

@NgModule({
declarations:[
HeaderComponent,
FooterComponent,
SidebarComponent,
InputComponent
],
exports:[
HeaderComponent,
FooterComponent,
SidebarComponent,
InputComponent
]
})
export class WidgetsModule { }

我在网上找不到任何解决方案(或无法确定发生了什么)，我已经找了一个星期来解决它。我期待你的回答，并提前感谢

编辑1

base.module.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { BaseRoutingModule } from './base-routing.module';
import { BaseComponent } from './base.component';
import { WidgetsModule } from 'src/app/widgets/widgets.module';

@NgModule({
declarations: [
BaseComponent
],
imports: [
CommonModule,
BaseRoutingModule,
WidgetsModule
]
})
export class BaseModule { }

编辑2

修改文件夹结构

Answer 1

检查您的存储库后，我发现您的问题是您的AppModule中没有导入BaseModule。否则你的逻辑是正确的。

Answer 2

此错误通常发生在您没有导入想要在其中使用该组件的模块时。因此，拥有基页组件的模块应该导入WidgetsModule。