enrutamiento estatico con Angular

app.routing.ts

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

import {ProductosComponent } from './productos.component';
import { HomeComponent } from './home/home.component';
import { EmpresaComponent} from './empresa/empresa.component';
import { NoticesComponent } from './notices/notices.component';
import { ContactoComponent } from './contacto/contacto.component';
import { NotificationsComponent } from './notifications/notifications.component';
import { RegistrosComponent } from './registros/registros.component';
import { SoporteComponent } from './soporte/soporte.component';
import { MapsComponent } from './maps/maps.component';


const appRoutes: Routes = [
	{
		path: '',
		redirectTo: '/',
		pathMatch: 'full'
	},
	{path: "empresa", component: EmpresaComponent},
    {path: "home", component: HomeComponent},
    {path: "noticias", component: NoticesComponent},
    {path: "contacto", component: ContactoComponent},
    {path: "notificaciones", component: NotificationsComponent},
    {path: "registros", component: RegistrosComponent},
    {path: "soporte", component: SoporteComponent},
    {path: "maps", component: MapsComponent}    

];

export const appRoutingProviders: any[] = [];

export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);

contacto.component.html

      <div class="texto-encabezado text-xs-center">
            <div class="container">
                <h1 class="display-4 wow bounceIn">{{title}}</h1>
                <p class="wow bounceIn" data-wow-delay=".3s">{{subtitle}}</p>

            </div>

        </div>
   
   
   <div class="col-md-8">
       <div class="card " [@carduserprofile]>
        <div class="container">
            <div class="row">

                <div class="col-md-8">
                    <h2 class="m-b-2">contacto</h2>


                    <form #formContacto="ngForm" (ngSubmit)="onSubmit()">

                        <div class="form-group row">
                            <label for="nombre" class="col-md-2 col-form-label">Nombre</label>
                            
                            <div class="col-md-7">
                                <input class="form-control" type="text" id="nombre" name="nombre" placeholder="{{name}}" data-toggle="tooltip" data-placement="top" [(ngModel)]="contacto.nombre" required *ngIf="!name.valid">
							
                            </div>
                        </div>


                        <div class="form-group row">
                            <label for="email" class="col-md-2 col-form-label">Email</label>

                            <div class="col-md-7">
                                <input class="form-control" type="text" id="email" name="email" placeholder="{{email}}" data-toggle="tooltip" data-placement="top" [(ngModel)]="contacto.email" *ngIf="!email.valid" required>
						
                            </div>
                        </div>


                        <div class="form-group row">
                            <label for="mensaje" class="col-md-2 col-form-label">Mensaje</label>

                            <div class="col-md-7">
                                <textarea class="form-control" rows="5" id="mensaje" name="mensaje" placeholder="{{message}}" data-toggle="tooltip" data-placement="top" title="Ingrese un mensaje" [(ngModel)]="contacto.mensaje"  required></textarea>
                            </div>
                        </div>


                        <div class="form-group row">
                            <div class="col-md-8 offset-md-4">
                                <button type="submit" class="btn btn-primary" [disabled]="!formContacto.form.valid" [routerLink]="['/empresa']">Enviar</button>
                                <button type="reset" class="btn btn-secondary"  [routerLink]="['/maps']" >Limpiar</button>
                            </div>
                        </div>
					
                    </form>
                </div>
            </div>
        </div>
    </div>
 </div>

 <div class="col-md-4">
                <div class="card card-user" [@cardprofile]>
                    <div class="image">
                     
                    </div>
                    <div class="content">
                        <div class="author">
                            <a href="#">
                             

                                <h4 class="title">XAS Dynamics<br/>
                                    <small>Autonomous Systems</small>
                                </h4>
                            </a>
                        </div>
                        <p class="description text-center"> Telephone: 22446611 <br>
                            Email: [email protected] <br>
                            Ubication:N.º 179, Calle La Reforma, San Salvador
                        </p>
                    </div>
                    <hr>
                    <div class="text-center">
                        <button href="https://www.facebook.com/ArtCodeStudios/" class="btn btn-facebook"><i class="fa fa-facebook-square"></i></button>
                        <button href="" class="btn btn-simple"><i class="fa fa-twitter"></i></button>
                        <button href="" class="btn btn-simple"><i class="fa fa-google-plus-square"></i></button>
                    </div>
                </div>
            </div>