Angular5 / Karma'选择器'不是已知元素[重复]

Posted 2023-03-07

【中文标题】Angular5 / Karma\'选择器\'不是已知元素[重复]

【英文标题】：Angular5/Karma 'selector' is not a known element [duplicate]Angular5 / Karma'选择器'不是已知元素[重复]

【发布时间】：2018-09-18 13:32:45

【问题描述】：

我的组件有一个小问题。在我的浏览器中一切正常，没有任何错误，但 Karma 调试器会引发一些错误，只要我想清楚一切，我想修复它。

错误：

Failed: Template parse errors:
'dj-menu' is not a known element:
1. If 'dj-menu' is an Angular component, then verify that it is part of this module.
2. If 'dj-menu' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

<dj-menu> 选择器用于app.component.html。

menu.component.ts

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

@Component(
    selector: 'dj-menu',
    template: `<nav>
                        <button mat-button routerLink="/login" routerLinkActive="active">Login</button>
                        <button mat-button routerLink="/register" routerLinkActive="active">Register</button>
                        <button mat-button routerLink="/profile" routerLinkActive="active">Profile</button>
                        <button mat-button routerLink="/radio">Radio</button>
                   </nav>
`,
    styleUrls: ['./menu.component.scss']
)
export class MenuComponent implements OnInit 
    ... // only an empty constructor and ngOnInit()

我在 app.module.ts 的 @NgModule 中的 declarations 中声明了一个 MenuComponent。

正如我所说，它在浏览器中运行良好，但在 Karma 调试器中却不行。到目前为止，我尝试了一些关于类似错误的答案（例如 If '<selector>' is an Angular component, then verify that it is part of this module），但没有任何效果。

感谢任何帮助，谢谢。

【问题讨论】：

您应该在 TestBed 中声明它，就像在 app.module.ts 中声明它一样（我假设您正在使用 TestBed 进行测试？）。

【参考方案1】：

在测试父组件时，您需要存根子组件，例如我有两个组件，一个是 app，另一个是 dj-menu，那么我应该在 app 中模拟 dj-menu，使用类似下面的代码进行测试

@Component(
selector: 'dj-menu',
  template: '<h1> Some test </h1>'
)

class DjMenuComponentStub

我的应用组件看起来像这样（使用dj-menu）

@Component(
selector: 'app',
  template: '<dj-menu></dj-menu>'
)

class AppComponent

在测试应用程序组件时，Angular 不知道 dj-menu 你必须通过声明告诉 Angular 使用存根组件

TestBed.configureTestingModule(
      declarations: [ DjMenuComponentStub ]
)

【讨论】：

存根假定他正在测试父组件。你无法从问题中看出他在测试什么。