argos/dmp-frontend/src/app/app-routing.module.ts

import { NgModule }             from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { PageNotFoundComponent }    from './not-found.component';
import { HomepageComponent }    from './homepage/homepage.component';
import { DynamicFormComponent } from './form/dynamic-form.component';
import { AuthGuard } from './guards/auth.guard';
import { DatasetsComponent } from './datasets/dataset.component';
import { AppComponent } from './app.component';
import { MainSignInComponent } from './login/main-sign-in/main-sign-in.component';
import { DmpDetailedComponent } from './viewers/dmp-detailed/dmp-detailed.component';
import { ProjectDetailedComponent } from './viewers/project-detailed/project-detailed.component';
import { ProjectListingModel } from './models/projects/ProjectListingModel';
import { ProjectListingComponent } from './projects/project-listing.component';
import { DataManagementPlanListingComponent } from './dmps/dmp-listing.component';
import { ProjectEditorComponent } from './projects/editor/project-editor.component';
import { DataManagementPlanEditorComponent } from './dmps/editor/dmp-editor.component';


const appRoutes: Routes = [
  
  { path: 'dynamic-form/:id', component: DynamicFormComponent, canActivate: [AuthGuard] },
  { path: 'dataset', component: DatasetsComponent },
  { path: 'login', component: MainSignInComponent},
  { path: 'projects', component: ProjectListingComponent},
  { path: 'project/:id', component: ProjectEditorComponent},
  { path: 'projects/new', component: ProjectEditorComponent},
  { path: 'dmps', component: DataManagementPlanListingComponent},
  { path: 'dmp/:id', component: DataManagementPlanEditorComponent},
  { path: 'dmps/new', component: DataManagementPlanEditorComponent},
  // { path: 'dmps', 
  //   component: DataManagementPlanListingComponent,
  //   children: [
  //     {
  //       path: "dmp",
  //       component: DmpDetailedComponent,
  //       data: {
  //         //breadcrumb: "Sign In"
  //       }
  //     },
  //     {
  //       path: "project",
  //       component: ProjectDetailedComponent,
  //       data: {
  //         //breadcrumb: "Sign Up"
  //       }
  //     }
  //   ]
  // },
  { path: 'welcome', component: HomepageComponent},
  { path: '',   redirectTo: '/login', pathMatch: 'full' },
  { path: '**', component: PageNotFoundComponent }

];

@NgModule({
  imports: [
    RouterModule.forRoot(
      appRoutes
      ,{ 
        useHash: false
        //,enableTracing: true <-- debugging purposes only
      } 
    )
  ],
  exports: [
    RouterModule
  ],
  providers: [
  ]
})
export class AppRoutingModule { }