'<selector>' 不是已知元素

时间:2020-12-19 19:36:08

标签: javascript angular

在我继续提问之前:我已经检查了具有相同标题的其他问题,并且我已经遵循了给出的建议。这些都没有帮助,所以我决定提出一个新问题。

我有一个包含一个模块和多个组件的 angular 项目。仪表板组件使用了明显无法识别的欢迎组件。

模块代码如下:

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

import { HomeComponent } from './home/home.component';
import { DashboardComponent } from './dashboard/dashboard.component';
import { FrameComponent } from './frame/frame.component';
import { WelcomeComponent } from './welcome/welcome.component';
import { CardComponent } from './card/card.component';
import { AlertComponent } from './alert/alert.component';

@NgModule({
  declarations: [
    FrameComponent,
    HomeComponent,
    CardComponent,
    WelcomeComponent,
    AlertComponent
  ],
  imports: [
    BrowserModule,
    RouterModule.forRoot([
      {
        path: '',
        component: HomeComponent
      },
      {
        path: 'dashboard',
        component: DashboardComponent
      }
    ])
  ],
  exports: [CardComponent, WelcomeComponent, AlertComponent],
  providers: [],
  bootstrap: [FrameComponent]
})
export class AppModule { }

如您所见,我导入了 WelcomeComponent,声明并导出了它。 WelcomeComponent 包含以下代码:

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

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

  @Input()
  message: string;
  welcomeMessage: string;

  constructor() { }

  ngOnInit(): void {
  }
}

在这里你可以看到 app-welcome 是一个选择器。它似乎连接正确。但是当我在示例中给出的dashboard.component.html 中使用它时

<app-welcome [message]="message" [welcomeMessage]="welcomeMessage"></app-welcome>

我收到以下错误:

<块引用>

错误:src/app/dashboard/dashboard.component.html:18:5 - 错误 NG8001:“app-welcome”不是已知元素: 1. 如果“app-welcome”是一个 Angular 组件,那么验证它是否是这个模块的一部分。 2. 如果'app-welcome' 是一个Web 组件,则将'CUSTOM_ELEMENTS_SCHEMA' 添加到该组件的'@NgModule.schemas' 以抑制此消息。

其他错误与welcome 和welcomeMessage 不存在相关,因为组件无法识别。

我尝试重新启动服务器,将其作为 --prod 运行。我尝试了我发现的一切。有谁知道这会导致什么?

1 个答案:

答案 0 :(得分:0)

仪表板组件未在您的 AppModule 中声明,这就是问题所在。 在这种情况下,您也不需要导出组件,只需声明它们即可。