Depois de inserir as rotas seguindo o exemplo da atividade Single Page Application (SPA) o aplicativo apresenta o erro:
Unhandled Promise rejection: 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.schema' of this component to suppress this message. ("[ERROR ->] "): AppComponent@0:0 ; Zone: ; Task: Promise.then ; Value: Error: 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.schema' of this component to suppress this message. ("[ERROR ->]
app.module.ts
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { FotoModule } from './foto/foto.module';
import { HttpModule } from '@angular/http';
import 'rxjs/add/operator/map';
import { PainelModule } from './painel/painel.module';
import { CadastroComponent } from './cadastro/cadastro.component';
import { ListagemComponent } from './listagem/listagem.component';
import { routing } from './app.routes';
@NgModule({
imports: [
BrowserModule,
FotoModule,
HttpModule,
PainelModule,
routing
],
declarations: [ AppComponent , CadastroComponent, ListagemComponent ],
bootstrap: [ AppComponent ]
})
export class AppModule { }
app.routes.ts
import { RouterModule,Routes } from '@angular/router';
import { ListagemComponent } from './listagem/listagem.component';
import { CadastroComponent } from './cadastro/cadastro.component';
export const appRoutes: Routes = [
{path:'',component:ListagemComponent},
{path:'cadastro',component:CadastroComponent},
{path:'**',redirectTo:''}
];
export const routing = RouterModule.forRoot(appRoutes);
app.component.html
<router-outlet></router-outlet>