N
N
Nikolay Semenov2018-08-13 16:31:08
Angular
Nikolay Semenov, 2018-08-13 16:31:08

Why is not a known element?

Guys, hello everyone!
Help me figure it out, I've been sitting for n hours and rummaged around. what is wrong in my routes
main module router

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

const appRoutes: Routes = [
  {
    path: 'adminca',
    loadChildren: './shared/layout/layout.module#LayoutModule'
  }
];

@NgModule({
  imports: [
    RouterModule.forRoot(appRoutes, { preloadingStrategy: PreloadAllModules })
  ],
  exports: [RouterModule]
})
export class AppRoutingModule {}

layout module
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';

import { LayoutRoutingModule } from './layout-routing.module';
import { StartPageComponent } from '../../modules/start-page/start-page.component';
import { SystemUsersComponent } from '../../modules/system-users/system-users.component';
import { LayoutComponent } from './layout.component';

@NgModule({
  declarations: [StartPageComponent, SystemUsersComponent, LayoutComponent],
  imports: [CommonModule, LayoutRoutingModule]
})
export class LayoutModule {}

Rota Layout module
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { StartPageComponent } from '../../modules/start-page/start-page.component';
import { SystemUsersComponent } from '../../modules/system-users/system-users.component';
import { LayoutComponent } from './layout.component';

export const layoutRoutes: Routes = [
  {
    path: '',
    component: LayoutComponent,
    children: [
      { path: '', component: StartPageComponent },
      { path: 'system-users', component: SystemUsersComponent }
    ]
  }
];

@NgModule({
  imports: [RouterModule.forChild(layoutRoutes)],
  exports: [RouterModule]
})
export class LayoutRoutingModule {}

well, app.module
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';
import { SharedModule } from './shared/shared.module';
import { AppRoutingModule } from './app-routing.module';
import { AuthModule } from './modules/auth/auth.module';

@NgModule({
  declarations: [AppComponent],
  imports: [BrowserModule, SharedModule, AppRoutingModule, AuthModule],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {}

Answer the question

In order to leave comments, you need to log in

1 answer(s)
E
Earphone, 2018-08-14
@nickola105

Try doing this in
router.module:

import { Routes, RouterModule, PreloadAllModules } from '@angular/router';
import { ModuleWithProviders } from '@angular/core';
import { LayoutComponent } from '../shared/layout/layout.component';

export const routes: Routes = [
  { path: '', redirectTo: 'adminca', pathMatch: 'full' },
  { path: 'adminca',   component: LayoutComponent}
];

export const routing: ModuleWithProviders = RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules });

app.module:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { AppComponent } from './app.component';
import { SharedModule } from './shared/shared.module';
import { routing } from './routing.module';
import { AuthModule } from './modules/auth/auth.module';

@NgModule({
  declarations: [AppComponent],
  imports: [BrowserModule, RouterModule, SharedModule, routing, AuthModule],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {}

layout.module:
import { NgModule, ModuleWithProviders, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RouterModule } from '@angular/router';
import { routing } from './layout.routes';
import { StartPageComponent } from '../../modules/start-page/start-page.component';
import { SystemUsersComponent } from '../../modules/system-users/system-users.component';
import { LayoutComponent } from './layout.component';

@NgModule({
  declarations: [StartPageComponent, SystemUsersComponent, LayoutComponent],
  imports: [CommonModule,  RouterModule, routing],
  providers : [],
  schemas: [ CUSTOM_ELEMENTS_SCHEMA ]
})
export class LayoutModule {
    static forRoot(): ModuleWithProviders {
        return {
          ngModule: LayoutModule,
          providers: []
        };
    }
 }

layout.routes:
import { Routes, RouterModule }  from '@angular/router';

import { ModuleWithProviders } from '@angular/core';

import { StartPageComponent } from '../../modules/start-page/start-page.component';
import { SystemUsersComponent } from '../../modules/system-users/system-users.component';
import { LayoutComponent } from './layout.component';

export const routes: Routes = [
  {
    path: 'adminca',
    component: LayoutComponent,
    children: [
      { path: '', redirectTo: 'start-page', pathMatch: 'full' },
      { path: 'start-page', component: StartPageComponent },
      { path: 'system-users', component: SystemUsersComponent }
    ]
  }
];

export const routing: ModuleWithProviders = RouterModule.forChild(routes);

Else, give full error.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question