Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Unexpected value 'undefined' declared by the module 'AppModule'

What is wrong here? I'm trying to make it work but I get that error in the header. I have included the <router-outlet></router-outlet> in the app.component.html that is being templateUrl called by the app.component.ts, still no luck.

app.module.ts:

import { NgModule }             from '@angular/core'; import { BrowserModule }        from '@angular/platform-browser'; import { FormsModule }          from '@angular/forms'; import { RouterModule, Routes } from '@angular/router';   import { AppComponent }  from './app.component'; import { AppRoutingModule } from './app-routing.module'; import { TopnavComponent } from './components/navbars/topnav/topnav.component'; import { LeftnavComponent } from './components/navbars/leftnav/leftnav.component'; import { LeftnavsecondaryComponent } from './components/navbars/leftnav-secondary/leftnav-secondary.component'; import { WorldofwarcraftComponent } from './components/games/worldofwarcraft/worldofwarcraft.component';  @NgModule({     imports:    [ BrowserModule, FormsModule, AppRoutingModule ],     declarations:   [ AppComponent, TopnavComponent, LeftnavComponent, LeftnavsecondaryComponent, WorldofwarcraftComponent ],     bootstrap:  [ AppComponent ] })  export class AppModule { } 

app-routing.module.ts:

import { NgModule }              from '@angular/core'; import { RouterModule, Routes }  from '@angular/router';  import { WorldofwarcraftComponent } from './components/games/worldofwarcraft/worldofwarcraft.component';  const appRoutes: Routes = [   { path: 'worldofwacraft', component: WorldofwarcraftComponent } ];  @NgModule({   imports: [ RouterModule.forRoot(appRoutes) ],   exports: [ RouterModule ] })  export class AppRoutingModule {} 
like image 221
Kyriakos Menelaou Avatar asked Jan 10 '17 03:01

Kyriakos Menelaou


People also ask

Why does my @ngmodule declare as undefined?

The error message is caused by some element of your @NgModule declarations: [ /* ... */ ] to be undefined ( … declared by the module … in the error message should be taken literally, it’s in the declarations !). For example, if you have a @NgModule declaration like this:

Why are the values I import to my App undefined?

It has to do with barrels and not with angular or the cli directly. If you try to log out the values you are importing into your app module I bet they are undefined.

Why does mycomponent return undefined when imported?

Another possible cause of this error is if one of the values in declarations is undefined. For example if you have an import statement like in your module file, and, for some reason, MyComponent is undefined, this will cause the same error message to appear.

Why is angular not recognizing my class name in app module?

So in the browser Angular is not able to recognize your fresh entries in app module because build is required to register them properly. So for development mode kill the current server and use ng serve. In my case it was class name diffrent and the name i.e in between { name } exported in app.mdoule.ts was diffrent


1 Answers

I got the same error , sometimes this issue occur and you only need to re-run the server using ng serve or whatever CLI you use , as mentioned here

like image 172
Cyber Progs Avatar answered Sep 17 '22 17:09

Cyber Progs