Angular 7: 'Cannot find name ' '

Max Chircop

I am working on a personal portfolio webiste in Angular 7 and am having problems when getting the routing to work. The site opens but displays nothing on the page. If I comment out my paths the site loads properly. I cannot find any resources that solve this problem.

//This is what I receive on my command line when I run ng serve.

    「wdm」: Compiled successfully.
    ERROR in src/app/app.module.ts(20,31): error TS2304: Cannot find name 'Contact'.
    src/app/app.module.ts(21,33): error TS2304: Cannot find name 'Portfolio'.

//This is my code to get the routing working.

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

    import { AppComponent } from './app.component';
    import { SideBarComponent } from './side-bar/side-bar.component';
    import { MainContentComponent } from './main-content/main-content.component';
    import { NavigationBarComponent } from './navigation-bar/navigation-bar.component';

    import { RouterModule, Routes } from '@angular/router';
    import { PortfolioComponent } from './portfolio/portfolio.component';
    import { ContactComponent } from './contact/contact.component';


    const appRoutes: Routes = [

        {path: 'contact', redirectTo: '/contact', pathMatch:'full'},
        {path: 'portfolio', redirectTo: '/portfolio', pathMatch:'full'},

        //this seems to be where I get the problem

        { path: 'contact', component: Contact.Component },
        { path: 'portfolio', component: Portfolio.Component }
    ]

    @NgModule({
        declarations: [
        AppComponent,
        SideBarComponent,
        MainContentComponent,
        NavigationBarComponent,
        PortfolioComponent,
        ContactComponent,
    ],

    imports: [
        BrowserModule,
        RouterModule.forRoot(appRoutes,{ enableTracing: true })    
    ],

        providers: [],
        bootstrap: [AppComponent]
    })
    export class AppModule { }
pajtim

please remove the dot in 'Contact.Component' and in 'Portfolio.Component' in lines 20 and 21 like this:

  { path: 'contact', component: ContactComponent },
  { path: 'portfolio', component: PortfolioComponent }

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related