Angular-cli: Unit test error: Router outlet is not a known element

[mariadigiledge]

i am getting following error when running a unit test using karma and jasmine

Error:
Failed: Template parse errors:
'router-outlet' is not a known element:

1. If 'router-outlet' is an Angular component, then verify that it is part of this module.
2. If 'router-outlet' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("
   home
   
   [ERROR ->]
   "): ng:///DynamicTestModule/AppComponent.html@5:2

My app.module.ts

app.component.html

app.component.ts

app.component.spec.ts

[BenjaminHofstetter]

Add

import { RouterTestingModule } from '@angular/router/testing';

and then

describe('AppComponent', () => {
  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [
        AppComponent
      ],
      imports: [
        RouterTestingModule
      ]
....

[mariadigiledge]

where should i add this code

On Wed, May 30, 2018 at 12:49 AM, Benjamin Hofstetter <
[email protected]> wrote:

Add

import { RouterTestingModule } from '@angular/router/testing';

and then

describe('AppComponent', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [
AppComponent
],
imports: [
RouterTestingModule
]....

—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub
https://github.com/angular/angular-cli/issues/11057#issuecomment-392908190,
or mute the thread
https://github.com/notifications/unsubscribe-auth/Al4yROTYqPP2kZOfArrUkaB30NU7nGgcks5t3Z80gaJpZM4URjih
.

[BenjaminHofstetter]

@mariadigiledge do you need still help?

[mariadigiledge]

Yes

On Tue, Jun 12, 2018, 11:13 AM Benjamin Hofstetter [e-mail]
wrote:

@mariadigiledge https://github.com/mariadigiledge do you need still
help?

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/angular/angular-cli/issues/11057#issuecomment-396471969,
or mute the thread
https://github.com/notifications/unsubscribe-auth/Al4yRHUk2K4_XhVsH6qoTWNbPCRZYr-Oks5t71TrgaJpZM4URjih
.

[BenjaminHofstetter]

ok..
at the top of your xxx.spec.ts file. Add import { RouterTestingModule } from '@angular/router/testing';

Then in the section

  TestBed.configureTestingModule({
      declarations: [
        AppComponent
      ],
      imports: [    //  <------ add the imports Array with the RouterTesting Module
        RouterTestingModule
      ]

[alan-agius4]

The RouterTestingModule is automatically added to app.component.spec.ts when you create an application with routing

[ghost]

Hello,

Here is the Quick and Simple Solution if anyone is getting the error:

" 'router-outlet' is not a known element " in angular project,

then,

Just go to the " app.module.ts " file & add the following Line:

" import { AppRoutingModule } from './app-routing.module'; "

and also ' AppRoutingModule ' in imports.

Thank you!!

[pramodjb]

hello Every one please help me,
i'm using angular7 and ionic 4 version ,
i'm getting error
App.module.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouteReuseStrategy } from '@angular/router';
import { LanguagePopoverPageModule } from './pages/language-popover/language-popover.module';
import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
import { SplashScreen } from '@ionic-native/splash-screen/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';

import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';
import { IonicStorageModule } from '@ionic/storage';
import { LocalStorageModule } from 'angular-2-local-storage';
import { AuthServiceService } from './auth-service.service';
import { HttpClientModule, HttpClient } from '@angular/common/http';
import { TranslateModule, TranslateLoader} from '@ngx-translate/core';
import { TranslateHttpLoader} from '@ngx-translate/http-loader';

export function createTranslateLoader(http: HttpClient) {
return new TranslateHttpLoader(http, 'assets/i18n/', '.json');
}

@NgModule({
declarations: [AppComponent],
entryComponents: [],
imports: [BrowserModule, HttpClientModule,
AppRoutingModule,
IonicStorageModule.forRoot(),
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useFactory: (createTranslateLoader),
deps: [HttpClient]
}
}),
LanguagePopoverPageModule,
LocalStorageModule.forRoot()],
providers: [
StatusBar,
SplashScreen,
{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy },
AuthServiceService
],
bootstrap: [AppComponent]
})
export class AppModule {}

app-routing.module.ts
import { NgModule } from '@angular/core';
import { PreloadAllModules, RouterModule, Routes } from '@angular/router';

const routes: Routes = [
{ path: '', redirectTo: 'login', pathMatch: 'full' },
{ path: 'home', loadChildren: './home/home.module#HomePageModule' },
{ path: 'login', loadChildren: './login/login.module#LoginPageModule' },
{ path: 'language-popover', loadChildren: './pages/language-popover/language-popover.module#LanguagePopoverPageModule' },

];

@NgModule({
imports: [
RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
],
exports: [RouterModule]
})
export class AppRoutingModule {
static forRoot: any;
}

advance thanks plz help how to clear this error,i'm stuck with this

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}