英文:
Standalone component NG8001: 'component' is not a known element
问题
这是我的独立组件
import { Component } from '@angular/core';
import { CommonModule } from '@angular/common';
@Component({
selector: 'app-navbar',
standalone: true,
imports: [CommonModule],
templateUrl: './navbar.component.html',
styleUrls: ['./navbar.component.scss']
})
export class NavbarComponent {
}
这是我导入它的地方（在admin模块）
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AdminRoutingModule } from './admin-routing.module';
import { UsersComponent } from './users/users.component';
import { NavbarComponent } from '../components/navbar/navbar.component';
@NgModule({
declarations: [
UsersComponent
],
imports: [
CommonModule,
AdminRoutingModule,
NavbarComponent,
]
})
export class AdminModule { }
在我的usercomponent.html模板中，我做了以下操作
<p>users works!</p>
<app-navbar></app-navbar>
当我运行ng serve时，我得到以下错误信息
`error NG8001: 'app-navbar' 不是已知元素：
- 如果'app-navbar'是Angular组件，请确保它是此模块的一部分。
- 如果'app-navbar'是Web组件，则将'CUSTOM_ELEMENTS_SCHEMA'添加到此组件的'@NgModule.schemas'以抑制此消息。
2
我想知道为什么会出现这个错误以及如何修复它。谢谢！
英文:
This is my standalone component
import { Component } from '@angular/core';
import { CommonModule } from '@angular/common';
@Component({
selector: 'app-navbar',
standalone: true,
imports: [CommonModule],
templateUrl: './navbar.component.html',
styleUrls: ['./navbar.component.scss']
})
export class NavbarComponent {
}
and this is where i have imported it (in admin module)
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AdminRoutingModule } from './admin-routing.module';
import { UsersComponent } from './users/users.component';
import { NavbarComponent } from '../components/navbar/navbar.component';
@NgModule({
declarations: [
UsersComponent
],
imports: [
CommonModule,
AdminRoutingModule,
NavbarComponent,
]
})
export class AdminModule { }
In my usercomponent.html template i did
<p>users works!</p>
<app-navbar></app-navbar>
When I run ng serve I got
`error NG8001: 'app-navbar' is not a known element:
- If 'app-navbar' is an Angular component, then verify that it is part of this module.
- If 'app-navbar' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
2 <app-navbar></app-navbar>`
I would like to know why I have this error and how to fix it
Thanks !
答案1
得分: 1
如果NavbarComponent是另一个模块的一部分，那么你必须使用exports[]导出该组件，然后在AdminModule中导入该模块，而不是导入组件。
如果它不是其他模块的一部分，你必须在declarations[]中包括该组件，而不是在imports[]中包括。
英文:
If NavbarComponent is part of another module, on that module you have to export the component using exports[], and then import the module, not the component on AdminModule.
If it is not part of other module, you have to include the component on declarations[] not on imports[].
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论