Angular Compile Error: NG6001: The class is listed in the declarations of the NgModule 'AppModule', but is not a directive, a component, or a pipe

Issue

App fails to compile with error

error NG6001: The class NavigationMenuItemComponent is listed in the declarations of the NgModule AppModule, but is not a directive, a component, or a pipe. Either remove it from the NgModule's declarations, or add an appropriate Angular decorator.

The error goes away when I remove the constructor with parameters. How can I resolve this whiles maintaining the constructor that has parameters, because I want to use to initialise a list of the component without having to call set methods for each member in the list

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

@Component({
    selector: 'app-navigation-menu-item',
    templateUrl: './navigation-menu-item.component.html',
    styleUrls: ['./navigation-menu-item.component.scss']
})
export class NavigationMenuItemComponent implements OnInit {
    static readonly ID_PREFIX: string = 'sidebar-menuitem-';
    static readonly ICON_CLASS_PREFIX: string = 'mdi mdi-';

    constructor(id: string, iconClass: string) {
        this._id = NavigationMenuItemComponent.ID_PREFIX + id;
        this._iconClass = NavigationMenuItemComponent.ICON_CLASS_PREFIX + iconClass;
    }
    //constructor() {}

    private _id: string;
    private _iconClass: string;

    get id() {
        return this._id;
    }

    get iconClass() {
        return this._iconClass;
    }

    set id(id: string) {
        this._id = NavigationMenuItemComponent.ID_PREFIX + id;
    }

    set iconClass(iconClass) {
        this._iconClass = NavigationMenuItemComponent.ID_PREFIX + iconClass;
    }

    ngOnInit(): void {}
}

Solution

You have to run npm install when creating new components. Hot reload doesn't seem to be able to add the component.

Answered By - zman