Component not showing its content on lazy loading

Question

I am having trouble sharing components in modules in Angular 8. I was trying to build a stackblitz but I got stuck in some problem. I don't know if the problem is related to Angular or stackblitz itselft. My example can be accessed here

here

When you click the link, to simulate a successful login you go to the home component. it has content but nothing appears.

You are required to post a [mcve] here, within your question, and not a link to any third party site. — Rob, Jan 04 '20 at 15:34
Pretty sure a working SB is enough to NOT close a question guys. Either way his problem is real and we should help him figure it out. — Ben Racicot, Jan 04 '20 at 15:47
@BenRacicot You would be wrong. Code examples are to be **within the question itself**. Links go dead over time. https://meta.stackoverflow.com/a/254430/162698 — Rob, Jan 04 '20 at 15:56

score 4 · Answer 1 · answered Jan 04 '20 at 16:01

I have made some changes and got output Look at below

First You have't add HomeComponent in HomeModule do it first

Here is your Home.module.ts

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

import { HomeRoutingModule } from './home-routing.module';
import {DashboardModule} from '../dashboard.module';
import { HomeComponent } from "./home.component";

@NgModule({
  declarations: [
    HomeComponent
  ],
  imports: [
    CommonModule,
    HomeRoutingModule,
    DashboardModule
  ]
})
export class HomeModule { }

Second change in your HomeRoutingModule added default path

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { HomeComponent } from "./home.component";


const routes: Routes = [{ path: '', component: HomeComponent }];

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

3 one is exports MenuLateralComponent in DashboardModule

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

import { DashboardRoutingModule } from './dashboard-routing.module';
import {MenuLateralComponent} from '../menu-lateral/menu-lateral.component';


@NgModule({
  declarations: [
    MenuLateralComponent

  ],
  imports: [
    CommonModule,
    DashboardRoutingModule
  ],
    exports: [MenuLateralComponent]

})
export class DashboardModule { }

now refresh your stackblitz browser.

you will be able to see below output

hope above code will help you

let me know if you have any issue

thanks

Thank you for answer. Now it runs. That's the first time I write code in Stackblitz. I am sad because now the code is very similar to my development environment that's not working but in Stackblitz it is. Can you check my previous question, it's basically the same problem. I am importing the dashboard module but the menuLateral component is not available to the home component: doesn't exist to home component. — Diego Alves, Jan 04 '20 at 17:23
I apparently solved my problem in my local development. I added the DashboardModule in the imports of the app.module. — Diego Alves, Jan 04 '20 at 17:38

Component not showing its content on lazy loading

1 Answers1