Skip to main content
uso impróprio do snippet de código onde não havia resultado reproduzível
Fonte Link
user28595
user28595

Criei um novo modulo em minha aplicação com a minhas rotas e fiz os inports necessário em meu app.modules, porem no console do navegador da um erro o qual não consegui resolver e também não achei nenhuma resposta para o angular 5x.

O erro que da é:

ERROR Error: StaticInjectorError[ChildrenOutletContexts]: StaticInjectorError[ChildrenOutletContexts]:

ERROR Error: StaticInjectorError[ChildrenOutletContexts]: StaticInjectorError[ChildrenOutletContexts]:

Meu arquivo de rotas é:

import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { CursosComponent } from './cursos/cursos.component';
import { LoginComponent } from './login/login.component';
import { HomeComponent } from './home/home.component';

const APP_ROUTES: Routes = [
    { path: 'cursos', component: CursosComponent },
    { path: 'login', component: LoginComponent },
    { path: '', component: HomeComponent }
];

const routing: ModuleWithProviders = RouterModule.forRoot(APP_ROUTES);

E meu app.module seria esse:

import { BrowserModule } from '@angular/platform-browser';
import { MaterializeModule } from 'angular2-materialize';
import { NgModule } from '@angular/core';


import { AppComponent } from './app.component';
import { HomeComponent } from './home/home.component';
import { LoginComponent } from './login/login.component';
import { CursosComponent } from './cursos/cursos.component';
import { RouterModule, Routes } from '@angular/router';


@NgModule({
        declarations: [
                AppComponent,
                HomeComponent,
                LoginComponent,
                CursosComponent
        ],
    imports: [
        BrowserModule,
        RouterModule
    ],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule { }

Alguém tem alguma ideia de como resolver isso?

Criei um novo modulo em minha aplicação com a minhas rotas e fiz os inports necessário em meu app.modules, porem no console do navegador da um erro o qual não consegui resolver e também não achei nenhuma resposta para o angular 5x.

O erro que da é:

ERROR Error: StaticInjectorError[ChildrenOutletContexts]: StaticInjectorError[ChildrenOutletContexts]:

Meu arquivo de rotas é:

import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { CursosComponent } from './cursos/cursos.component';
import { LoginComponent } from './login/login.component';
import { HomeComponent } from './home/home.component';

const APP_ROUTES: Routes = [
    { path: 'cursos', component: CursosComponent },
    { path: 'login', component: LoginComponent },
    { path: '', component: HomeComponent }
];

const routing: ModuleWithProviders = RouterModule.forRoot(APP_ROUTES);

E meu app.module seria esse:

import { BrowserModule } from '@angular/platform-browser';
import { MaterializeModule } from 'angular2-materialize';
import { NgModule } from '@angular/core';


import { AppComponent } from './app.component';
import { HomeComponent } from './home/home.component';
import { LoginComponent } from './login/login.component';
import { CursosComponent } from './cursos/cursos.component';
import { RouterModule, Routes } from '@angular/router';


@NgModule({
        declarations: [
                AppComponent,
                HomeComponent,
                LoginComponent,
                CursosComponent
        ],
    imports: [
        BrowserModule,
        RouterModule
    ],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule { }

Alguém tem alguma ideia de como resolver isso?

Criei um novo modulo em minha aplicação com a minhas rotas e fiz os inports necessário em meu app.modules, porem no console do navegador da um erro o qual não consegui resolver e também não achei nenhuma resposta para o angular 5x.

O erro que da é:

ERROR Error: StaticInjectorError[ChildrenOutletContexts]: StaticInjectorError[ChildrenOutletContexts]:

Meu arquivo de rotas é:

import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { CursosComponent } from './cursos/cursos.component';
import { LoginComponent } from './login/login.component';
import { HomeComponent } from './home/home.component';

const APP_ROUTES: Routes = [
    { path: 'cursos', component: CursosComponent },
    { path: 'login', component: LoginComponent },
    { path: '', component: HomeComponent }
];

const routing: ModuleWithProviders = RouterModule.forRoot(APP_ROUTES);

E meu app.module seria esse:

import { BrowserModule } from '@angular/platform-browser';
import { MaterializeModule } from 'angular2-materialize';
import { NgModule } from '@angular/core';


import { AppComponent } from './app.component';
import { HomeComponent } from './home/home.component';
import { LoginComponent } from './login/login.component';
import { CursosComponent } from './cursos/cursos.component';
import { RouterModule, Routes } from '@angular/router';


@NgModule({
        declarations: [
                AppComponent,
                HomeComponent,
                LoginComponent,
                CursosComponent
        ],
    imports: [
        BrowserModule,
        RouterModule
    ],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule { }

Alguém tem alguma ideia de como resolver isso?

uso impróprio do snippet de código onde não havia resultado reproduzível
Fonte Link

import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { CursosComponent } from './cursos/cursos.component';
import { LoginComponent } from './login/login.component';
import { HomeComponent } from './home/home.component';

const APP_ROUTES: Routes = [
    { path: 'cursos', component: CursosComponent },
    { path: 'login', component: LoginComponent },
    { path: '', component: HomeComponent }
];

const routing: ModuleWithProviders = RouterModule.forRoot(APP_ROUTES);

import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { CursosComponent } from './cursos/cursos.component';
import { LoginComponent } from './login/login.component';
import { HomeComponent } from './home/home.component';

const APP_ROUTES: Routes = [
    { path: 'cursos', component: CursosComponent },
    { path: 'login', component: LoginComponent },
    { path: '', component: HomeComponent }
];

const routing: ModuleWithProviders = RouterModule.forRoot(APP_ROUTES);

import { BrowserModule } from '@angular/platform-browser';
import { MaterializeModule } from 'angular2-materialize';
import { NgModule } from '@angular/core';


import { AppComponent } from './app.component';
import { HomeComponent } from './home/home.component';
import { LoginComponent } from './login/login.component';
import { CursosComponent } from './cursos/cursos.component';
import { RouterModule, Routes } from '@angular/router';


@NgModule({
    declarations: [
        AppComponent,
        HomeComponent,
        LoginComponent,
        CursosComponent
    ],
    imports: [
        BrowserModule,
        RouterModule
    ],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule { }

import { BrowserModule } from '@angular/platform-browser';
import { MaterializeModule } from 'angular2-materialize';
import { NgModule } from '@angular/core';


import { AppComponent } from './app.component';
import { HomeComponent } from './home/home.component';
import { LoginComponent } from './login/login.component';
import { CursosComponent } from './cursos/cursos.component';
import { RouterModule, Routes } from '@angular/router';


@NgModule({
        declarations: [
                AppComponent,
                HomeComponent,
                LoginComponent,
                CursosComponent
        ],
    imports: [
        BrowserModule,
        RouterModule
    ],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule { }

import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { CursosComponent } from './cursos/cursos.component';
import { LoginComponent } from './login/login.component';
import { HomeComponent } from './home/home.component';

const APP_ROUTES: Routes = [
    { path: 'cursos', component: CursosComponent },
    { path: 'login', component: LoginComponent },
    { path: '', component: HomeComponent }
];

const routing: ModuleWithProviders = RouterModule.forRoot(APP_ROUTES);

import { BrowserModule } from '@angular/platform-browser';
import { MaterializeModule } from 'angular2-materialize';
import { NgModule } from '@angular/core';


import { AppComponent } from './app.component';
import { HomeComponent } from './home/home.component';
import { LoginComponent } from './login/login.component';
import { CursosComponent } from './cursos/cursos.component';
import { RouterModule, Routes } from '@angular/router';


@NgModule({
    declarations: [
        AppComponent,
        HomeComponent,
        LoginComponent,
        CursosComponent
    ],
    imports: [
        BrowserModule,
        RouterModule
    ],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule { }

import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { CursosComponent } from './cursos/cursos.component';
import { LoginComponent } from './login/login.component';
import { HomeComponent } from './home/home.component';

const APP_ROUTES: Routes = [
    { path: 'cursos', component: CursosComponent },
    { path: 'login', component: LoginComponent },
    { path: '', component: HomeComponent }
];

const routing: ModuleWithProviders = RouterModule.forRoot(APP_ROUTES);
import { BrowserModule } from '@angular/platform-browser';
import { MaterializeModule } from 'angular2-materialize';
import { NgModule } from '@angular/core';


import { AppComponent } from './app.component';
import { HomeComponent } from './home/home.component';
import { LoginComponent } from './login/login.component';
import { CursosComponent } from './cursos/cursos.component';
import { RouterModule, Routes } from '@angular/router';


@NgModule({
        declarations: [
                AppComponent,
                HomeComponent,
                LoginComponent,
                CursosComponent
        ],
    imports: [
        BrowserModule,
        RouterModule
    ],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule { }
Fonte Link

Problema com rotas angular 5x

Criei um novo modulo em minha aplicação com a minhas rotas e fiz os inports necessário em meu app.modules, porem no console do navegador da um erro o qual não consegui resolver e também não achei nenhuma resposta para o angular 5x.

O erro que da é:

ERROR Error: StaticInjectorError[ChildrenOutletContexts]: StaticInjectorError[ChildrenOutletContexts]:

Meu arquivo de rotas é:

import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { CursosComponent } from './cursos/cursos.component';
import { LoginComponent } from './login/login.component';
import { HomeComponent } from './home/home.component';

const APP_ROUTES: Routes = [
    { path: 'cursos', component: CursosComponent },
    { path: 'login', component: LoginComponent },
    { path: '', component: HomeComponent }
];

const routing: ModuleWithProviders = RouterModule.forRoot(APP_ROUTES);

E meu app.module seria esse:

import { BrowserModule } from '@angular/platform-browser';
import { MaterializeModule } from 'angular2-materialize';
import { NgModule } from '@angular/core';


import { AppComponent } from './app.component';
import { HomeComponent } from './home/home.component';
import { LoginComponent } from './login/login.component';
import { CursosComponent } from './cursos/cursos.component';
import { RouterModule, Routes } from '@angular/router';


@NgModule({
    declarations: [
        AppComponent,
        HomeComponent,
        LoginComponent,
        CursosComponent
    ],
    imports: [
        BrowserModule,
        RouterModule
    ],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule { }

Alguém tem alguma ideia de como resolver isso?