I am encountering a small issue with my component. While everything seems to be working fine in my browser without any errors, the Karma debugger is throwing some errors that I would like to resolve for clarity.
Error:
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.
The <dj-menu> selector is being used in 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()
}
I have a MenuComponent declared in declarations within the @NgModule of app.module.ts.
While the component works well in the browser, there are issues in the Karma debugger. I have tried several solutions found online, such as If '<selector>' is an Angular component, then verify that it is part of this module, but none have resolved the problem yet.
Your assistance is much appreciated, thank you.