The report generator component

We are going create the basic structure of the main component and add the required features as we proceed. So create the main component first:

// src/app/report/report.component.ts 
import {Component, OnInit} from '@angular/core'; 
@Component({ 
  selector: 'sh-report', 
  templateUrl: './report.html' 
}) 
export class ReportComponent implements OnInit { 
  constructor() {} 
  ngOnInit() {} 
} 

Next, check out the application routes and make sure the new component is visible to the routing system:

// src/app/app.routes.ts 
//... 
import {ReportComponent} from "./report/report.component"; 
export const rootRouterConfig: Routes = [ 
  //... 
  {path: 'report', component: ReportComponent}, 
]; 

Then import and declare the new component to the application module:

// src/app/ap.module.ts 
//... 
import {ReportService} from "./report/report.service"; 
//... 
@NgModule({ 
  declarations: [ 
    AppComponent, NavigationComponent, CollectorComponent, 
    RatingComponent...