I have a problem with this code, I do it exactly like the video tutorial (I'm learning), but it doesn't work and calls for some declarations. It is possible that the code written in the guide is in some older methodology? Its hard code without service.

app-routing.module.ts

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { DepartmentListComponent } from './department-list/department-list.component';
import { EmployeeListComponent } from './employee-list/employee-list.component';
const routes: Routes = [ { path: 'departments', component: DepartmentListComponent }, { path: 'employees', component: EmployeeListComponent }
];
@NgModule({ imports: [RouterModule.forRoot(routes)], exports: [RouterModule]
})
export class AppRoutingModule { }
export const routingComponents [DepartmentListComponent, EmployeeListComponent ]

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppRoutingModule, routingComponents } from './app-routing.module';
import { AppComponent } from './app.component';
@NgModule({ declarations: [ AppComponent, routingComponents ], imports: [ BrowserModule, AppRoutingModule ], providers: [], bootstrap: [AppComponent]
})
export class AppModule { }

app.component.html

<h1> Welocme in routing</h1>
<router-outlet></router-outlet>

I need to see running application with changing urls form and . I am begginer so please be understanding.

9

8 Answers

You are exporting DepartmentListComponent in this file which is imported in the same file module locally.

When we import and export same module in same file, this error is thrown.

Checkout the all imports and make sure that those are not exported from same file.

Same problem here with even stranger resolution: Remove the export line (last line). Compile (normally without errors) Add the last line again. Compile... Done. Don't ask me why. I am also a starter learning typescript and Angular along the way ;-)

4

I got the same problem using Webstorm, a restart + cache clean solved the issue for me.

I had this error message when accidentally exporting the same interface twice from the same file.

I had this same error on a newly created and exported interface. Adding the 'Interface' suffix to the interface name solved it for me.

Change:

export interface SomeThing {}

To:

export interface SomeThingInterface {}

On intellij IDEs, I found that removing the export and adding it again (before the instance, not the class) worked.

I had

// x.ts
export class X {}

// y.ts
import {X} from "./x.ts"
export const instance = new X(); // the export to be removed in my case

You can't re-export an import as a const. So

export const routingComponents [DepartmentListComponent, EmployeeListComponent ]

should be

export const routingComponents = [DepartmentListComponent, EmployeeListComponent]

or

export { DepartmentListComponent, EmployeeListComponent }

Your Answer

Sign up or log in

Sign up using Google Sign up using Facebook Sign up using Email and Password Submit

Post as a guest

Post Your Answer Discard

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy