CODEWITHSUNDEEP
angulartypescriptdialog
dioni
dioni

Reputation: 11

error NG6001: The class 'EaZimmerkatDialogComponent' is listed in the declarations of the NgModule 'AppModule', but is not a directive, a component

I wanted to create a dialog for my page. After I created the component and started my application it returned two errors:

Error: src/app/app.module.ts:39:5 - error NG6001: The class 'EaZimmerkatDialogComponent' 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 de clarations, or add an appropriate Angular decorator.

and

Error: src/app/dialogs/ea-zimmerkat-dialog/ea-zimmerkat-dialog.component.ts:14:5 - error NG1005: Unexpected decorator inject on parameter.

I can't explain and find the mistake in the code.

code src/app/app.module.ts:

import {EaZimmerkatDialogComponent} from "./dialogs/ea-zimmerkat-dialog/ea-zimmerkat-dialog.component";

@NgModule({
  declarations: [
    AppComponent,
    HomeComponent,
    AboutComponent,
    AGastComponent,
    AZimmerComponent,
    AZimmerkatComponent,
    EaGastComponent,
    EaZimmerComponent,
    EaZimmerkatComponent,
    GrundgeruestComponent,
    EaZimmerkatDialogComponent,
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    HttpClientModule,
    BrowserAnimationsModule,
    MatTableModule,
    MatPaginatorModule,
    MatSortModule,
    MatOptionModule,
    MatFormFieldModule,
    MatSelectModule,
    MatIconModule,
    MatButtonModule,
    MatInputModule,
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

code src/app/dialogs/ea-zimmerkat-dialog/ea-zimmerkat-dialog.component.ts:

import { Component, OnInit, inject} from '@angular/core';
import {MAT_DIALOG_DATA, MatDialogRef} from "@angular/material/dialog";
import {category} from "../../category";

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

  constructor(
    public dialogRef: MatDialogRef<EaZimmerkatDialogComponent>,
    @inject(MAT_DIALOG_DATA) public data: category) {}

  ngOnInit(): void {
  }

  onNoClick(): void {
    this.dialogRef.close();
  }

}

Upvotes: 1

Views: 1057

Answers (2)

Gichimu
Gichimu

Reputation: 71

To add onto Octavian Mărculescu's answer, kindly make sure the correct decorator is imported like so:

import {Inject} from '@angular/core';

Save yourself hours of debugging :)

Upvotes: 1

OctavianM
OctavianM

Reputation: 4597

Inside your EaZimmerkatDialogComponent where you try to inject the MAT_DIALOG_DATA token, you use @inject with lowercase i. Try replacing that with @Inject (with uppercase I).

Upvotes: 2

Related Questions