Frontend Angular 4/src/app/layout/grupos/grupos.module.ts

-import { NgModule } from '@angular/core';
-import { FormsModule } from '@angular/forms';
-import { GruposComponent } from './grupos.component';
-import { CommonModule } from '@angular/common';
-import { GruposRoutingModule } from './grupos-routing.module';
-import { DialogService } from "ng2-bootstrap-modal";
-import { NotificacionService } from '../../shared/services/notificacion.service';
-import { BootstrapModalModule } from 'ng2-bootstrap-modal';
-import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
-import { CodemirrorModule } from 'ng2-codemirror';
-import { CalificarEntrega } from './calificarEntrega.component';
-import { NotificacionModule } from '../../notificacion/notificacion.module'; 
+import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from "@angular/core";
+import { FormsModule } from "@angular/forms";
+import { GruposComponent } from "./grupos.component";
+import { CommonModule } from "@angular/common";
+import { GruposRoutingModule } from "./grupos-routing.module";
+import { NgbModule } from "@ng-bootstrap/ng-bootstrap";
+import { LtCodemirrorModule } from "lt-codemirror";
+import { NotificacionModule } from "../../notificacion/notificacion.module";
+import { I18nModule } from "../../shared/modules/translate/i18n.module";
+import { TitleCaseModule } from "../../shared/modules/titlecase.module";
 
 @NgModule({
-    imports: [CommonModule, GruposRoutingModule, FormsModule,BootstrapModalModule, NgbModule, CodemirrorModule,NotificacionModule],
-    declarations: [GruposComponent, CalificarEntrega],
-    exports: [GruposComponent],
-    entryComponents: [CalificarEntrega]
+  imports: [
+    CommonModule,
+    GruposRoutingModule,
+    FormsModule,
+    NgbModule,
+    LtCodemirrorModule,
+    NotificacionModule,
+    I18nModule,
+    TitleCaseModule,
+  ],
+  declarations: [GruposComponent],
+  exports: [GruposComponent],
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
 })
-
-export class GruposModule { }
+export class GruposModule {}

Frontend Angular 4/src/app/layout/layout-routing.module.ts

-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-import { LayoutComponent } from './layout.component';
+import { NgModule } from "@angular/core";
+import { Routes, RouterModule } from "@angular/router";
+import { LayoutComponent } from "./layout.component";
 
 const routes: Routes = [
-    {
-        path: '', component: LayoutComponent,
-        children: [
-            { path: 'matefun', loadChildren: './matefun/matefun.module#MateFunModule' },
-            { path: 'archivos', loadChildren: './archivos/archivos.module#ArchivosModule' },
-            { path: 'grupos', loadChildren: './grupos/grupos.module#GruposModule' }            
-        ]
-    }
+  {
+    path: "",
+    component: LayoutComponent,
+    children: [
+      {
+        path: "matefun",
+        loadChildren: () => import('./matefun/matefun.module').then(m => m.MateFunModule),
+      },
+      {
+        path: "archivos",
+        loadChildren: () => import('./archivos/archivos.module').then(m => m.ArchivosModule),
+      },
+      { path: "grupos", loadChildren: () => import('./grupos/grupos.module').then(m => m.GruposModule) },
+    ],
+  },
 ];
 
 @NgModule({
-    imports: [RouterModule.forChild(routes)],
-    exports: [RouterModule]
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
 })
-export class LayoutRoutingModule { }
+export class LayoutRoutingModule {}

Frontend Angular 4/src/app/layout/layout.component.spec.ts

-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { ComponentFixture, TestBed, waitForAsync } from "@angular/core/testing";
 
-import { LayoutComponent } from './layout.component';
+import { LayoutComponent } from "./layout.component";
 
-describe('LayoutComponent', () => {
+describe("LayoutComponent", () => {
   let component: LayoutComponent;
   let fixture: ComponentFixture<LayoutComponent>;
 
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
-      declarations: [ LayoutComponent ]
-    })
-    .compileComponents();
+      declarations: [LayoutComponent],
+    }).compileComponents();
   }));
 
   beforeEach(() => {
@@ -19,7 +18,7 @@ describe('LayoutComponent', () => {
     fixture.detectChanges();
   });
 
-  it('should create', () => {
+  it("should create", () => {
     expect(component).toBeTruthy();
   });
 });

Frontend Angular 4/src/app/layout/matefun/index.ts

 /**
  * This barrel file provides the export for the lazy loaded BlankpageComponent.
  */
-export * from './matefun.component';
-export * from './matefun.routes';
+export * from "./matefun.component";
+export * from "./matefun.routes";

Frontend Angular 4/src/app/layout/matefun/matefun-routing.module.ts

-import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
+import { NgModule } from "@angular/core";
+import { Routes, RouterModule } from "@angular/router";
 
-import { MateFunComponent } from './matefun.component';
+import { MateFunComponent } from "./matefun.component";
 
-const routes: Routes = [
-    { path: '', component: MateFunComponent }
-];
+const routes: Routes = [{ path: "", component: MateFunComponent }];
 
 @NgModule({
-    imports: [RouterModule.forChild(routes)],
-    exports: [RouterModule]
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
 })
-export class MateFunRoutingModule { }
\ No newline at end of file
+export class MateFunRoutingModule {}