Create Module

The first step is to check our directory path. Once we made sure that we are in the smuportal-frontend, we navigate to applications folder. You can navigate through folders in the console using thecd <directory>command.

/smuportal-frontend/src/app/applications

Once you reached the path, run the command:

ng generate module book-management-system

This will create a new folder that contains a file "book-management-system.module.ts"

We also need to modify our "applications.module.ts" which in the parent folder. We will only modify the routes. We need to define that in our applications module we have added a new application (which is the book management system), and we give the path we want and its module.

import { NgModule } from "@angular/core";
import { Routes, RouterModule } from "@angular/router";
import { CommonModule } from "@angular/common";

const routes: Routes = [
  {
    path: "apps", children: [
      {
        path: "logistics", loadChildren: () =>
          import("./logistics-reservation/logistics-reservation.module").then(
            m => m.LogisticsReservationModule
          )
      },
      {
        path: "bms", loadChildren: () =>
          import("./book-management-system/book-management-system.module").then(
            m => m.BookManagementSystemModule
          )
      },
    ]
  }
];
@NgModule({
  declarations: [],
  imports: [CommonModule, RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class ApplicationsModule { }

Finally, we need to make some small modifications in the box booking since we modified our applications module. We need to modify the file "logistics-reservation.module.ts" by replacing line 14 with:

path: "",

In addition we need to change the file "box-list.component.ts" by replacing line 96 with:

this.router.navigate(["/apps/logistics/book-box", boxId]);

Last updated