angular - Angular 7 - 生产构建错误 - 无法确定 X 类组件的模块！将 X 组件添加到 NgModule 以修复它

Question

查了类似的问题，没找到答案

解决方案指向 FileName 错误，但这似乎不是问题。换了一个新组件，还是一样的错误。

另一种解决方案指向区分大小写的错误，尝试过，但没有用

Git 回购

组件页面

import { DoctorModel } from './../../shared/Doctor/doctor-model';
import { environment } from 'environments/environment';
import { DoctorService } from './../../shared/Doctor/doctor.service';
import { Event } from './../../../lib/angular-bootstrap-md/utils/facade/browser';
import { SpecializationService } from './../../shared/specialization.service';
import { LocationService } from './../../shared/location.service';
import { HospitalService } from './../../shared/Hospital/hospital.service';
import { Component, OnInit, ViewChild } from '@angular/core';
import { HospitalModel } from 'app/shared/Hospital/hospital';
import { NgbDateStruct, NgbCalendar } from '@ng-bootstrap/ng-bootstrap';
import { ToastrService } from 'ngx-toastr';
import { BookingService } from 'app/shared/booking.service';
import { NgForm } from '@angular/forms';
import { TimeSlotModel } from 'app/shared/time-slot-model';
import { UserService } from 'app/shared/user.service';
import { Router } from '@angular/router';

@Component({
  selector: 'app-search-doctor',
  templateUrl: './search-doctor.component.html',
  styleUrls: ['./search-doctor.component.scss']
})
export class SearchDoctorComponent implements OnInit {
  @ViewChild('centralLarge') public BookingModel;
  HospitalList: HospitalModel[];
  StateList: any[];
  DistrictList: any[];
  SpecializationList: any[];
  DoctorList: any[];
  rootURL: string;
  DrpSpecializationID: string;
  DrpHospitalID: string;
  DrpDistrictID: string;
  DrpStateID: string;
  TxtDoctorSearch: string;
  ErrorImageURL: string;
  doctorModel: DoctorModel;
  model: NgbDateStruct;
  isValid: false;
  TokenList: any;
  TimeSlotList: any;

  constructor(
    private hospitalService: HospitalService,
    private locationService: LocationService,
    private specilizationService: SpecializationService,
    private doctorService: DoctorService,
    private calendar: NgbCalendar,
    public bookingService: BookingService,
    private toastr: ToastrService,
    private userService: UserService,
    private router: Router
  ) {}

  ngOnInit() {
    this.rootURL = environment.rootUrl;
    this.ErrorImageURL = environment.rootUrl + '/Images/no-image.png';
    this.getStates();
    this.resetForm();
  }

  GetDate() {
    if (this.model !== undefined) {
      this.bookingService.formData.BookingForMonth = this.model.month;
      this.bookingService.formData.BookingForYear = this.model.year;
      this.bookingService.formData.BookingForDay = this.model.day;

      if (this.doctorModel.BookingType === 'Token') {
        // tslint:disable-next-line:max-line-length
        this.bookingService
          .DoctorTokenAvailabilty(
            this.doctorModel.Id,
            this.model.day,
            this.model.month,
            this.model.year
          )
          .subscribe(res => {
            this.TokenList = res;
          });
      } else {
        // tslint:disable-next-line:max-line-length
        this.bookingService
          .DoctorTimeSlotAvailabilty(
            this.doctorModel.Id,
            this.model.day,
            this.model.month,
            this.model.year
          )
          .subscribe(res => {
            this.TimeSlotList = res;
          });
      }
    }
  }

  selectToday() {
    this.model = this.calendar.getToday();
  }

  getStates() {
    this.locationService.getAllStates().subscribe((data: any) => {
      this.StateList = data;
      // if (data.Succeeded === true) {
      // }
    });
  }

  resetForm(form?: NgForm) {
    if ((form = null)) {
      form.resetForm();
    }

    this.DrpSpecializationID = '';
    this.DrpHospitalID = '';
    this.DrpDistrictID = '';
    this.DrpStateID = '';
    this.TxtDoctorSearch = '';

    this.bookingService.formData = {
      BookingForDay: null,
      BookingForMonth: null,
      BookingForYear: null,
      BookingRequirement: '',
      CancelReason: '',
      CancelledOn: '',
      ConfirmedBy: '',
      ConfirmedOn: '',
      ConsultationOrFollowUp: '',
      ContactNumber: '',
      CustomerID: '',
      DoctorBookingID: null,
      DoctorID: '',
      HospitalID: null,
      BookingFor: '',
      IsCancelled: false,
      IsConfirmedByHospital: false,
      IsEdit: false,
      LastVisiDateMonth: null,
      LastVisitDateYear: null,
      PatientName: '',
      TimeSlot: '',
      TokenID: null,
      TokenNumber: null
    };
  }

  errorHandler(event) {
    // alert(this.ErrorImageURL);
    event.target.src = this.ErrorImageURL;
  }

  OnStateChange(event): void {
    const StateID: number = event.target.value;
    this.GetDistrictsOfThisState(StateID);
  }

  GetDistrictsOfThisState(StateID: number) {
    this.locationService
      .GetDistrictsOfThisState(StateID)
      .subscribe((data: any) => {
        this.DistrictList = data;
        // if (data.Succeeded === true) {
        // }
      });
  }

  OnDistrictChange(event): void {
    const DistrictID = event.target.value;
    this.SearchHospitalFilter(DistrictID);
  }

  SearchHospitalFilter(DistrictID) {
    this.hospitalService
      .SearchHospital(DistrictID)
      .subscribe((data: HospitalModel[]) => {
        this.HospitalList = data;
        // if (this.HospitalList.length > 0) {
        //   alert(this.HospitalList.length);
        // }
        // if (data.Succeeded === true) {
        // }
      });
  }

  OnHospitalChange(event): void {
    const HospitalID = event.target.value;
    this.GetSpecialization(HospitalID);
  }

  GetSpecialization(HospitalID) {
    this.specilizationService
      .getSpecilization(HospitalID)
      .subscribe((data: any) => {
        this.SpecializationList = data;
        // if (this.HospitalList.length > 0) {
        //   alert(this.HospitalList.length);
        // }
        // if (data.Succeeded === true) {
        // }
      });
  }

  SearchDoctor(): void {
    const SpecializationID = this.DrpSpecializationID;
    const HospitalID = this.DrpHospitalID;
    const SearchWord = this.TxtDoctorSearch;
    this.doctorService
      .GetDoctorList(HospitalID, SpecializationID, SearchWord)
      .subscribe((data: string) => {
        this.DoctorList = JSON.parse(data);
        // if (data.Succeeded === true) {
        // }
      });
  }

  BookDoctor(DoctorID: string): void {
    if (this.userService.CheckIfLoggedIN() === false) {
      this.toastr.warning('Login and continue booking', '', {
        positionClass: 'toast-bottom-center'
      });
      this.router.navigate(['/login'], {
        queryParams: { returnUrl: 'hospital/search?DoctorID=' + DoctorID }
      });
    } else if (this.userService.CheckIfCustomer() === false) {
      this.toastr.warning('Login as customer', '', {
        positionClass: 'toast-bottom-center'
      });
      this.router.navigate(['/login'], {
        queryParams: { returnUrl: 'hospital/search?DoctorID=' + DoctorID }
      });
    }

    // alert(DoctorID);
    this.bookingService.formData.DoctorID = DoctorID;

    this.doctorService.getDoctorByID(DoctorID).then(res => {
      this.doctorModel = res;
      this.GetDate();
      // this.service.formData = res;
      // this.service.formData.IsEdit = true;
      // this.contentModal.show();
      // this.isValid = false;
      // this.startTime = {
      //   hour: this.service.formData.StartTimeHour,
      //   minute: this.service.formData.StartTimeMinute
      // };
      // this.endTime = {
      //   hour: this.service.formData.EndTimeHour,
      //   minute: this.service.formData.EndTimeMinute
      // };

      this.BookingModel.show();
    });
  }

  validateForm() {
    if (this.bookingService.formData.BookingForDay == null) {
      this.isValid = false;
      return false;
    } else if (this.bookingService.formData.BookingFor === '') {
      this.isValid = false;
      return false;
    }
    return true;
  }

  SubmitThisForm(form: NgForm) {
    this.bookingService.formData.BookingForYear = this.model.year;
    this.bookingService.formData.BookingForMonth = this.model.month;

    if (this.validateForm()) {
      this.bookingService.AddOrUpdateBooking().subscribe(res => {
        if (this.bookingService.formData.IsEdit === true) {
          this.toastr.success('Updated Successfully', '', {
            positionClass: 'toast-bottom-center'
          });
        } else {
          this.toastr.success('Booked Successfully', '', {
            positionClass: 'toast-bottom-center'
          });
        }
        // this.router.navigate(['../admin/HospitalManage']);
        this.BookingModel.hide();
        this.resetForm();
      });
    }
  }
}

模块页面

import { AgmCoreModule } from '@agm/core';
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import {
  NgModule,
  NO_ERRORS_SCHEMA,
  CUSTOM_ELEMENTS_SCHEMA
} from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { RouterModule } from '@angular/router';
import { AppComponent } from './app.component';
import { AppRoutes } from './app.routes.service';

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

import { ViewsModule } from './views/views.module';
import { SharedModule } from './shared/shared.module';
import { ErrorModule } from './views/errors/error.module';

// main layout
import { NavigationModule } from './main-layout/navigation/navigation.module';

import { UserService } from './shared/user.service';
import { DoctorService } from './shared/Doctor/doctor.service';
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';
import { ToastrModule } from 'ngx-toastr';

import { ConfirmationDialogService } from 'lib/confirmation-dialog/confirmation-dialog.service';
import { ConfirmationDialogComponent } from 'lib/confirmation-dialog/confirmation-dialog.component';

import { AuthGuard } from './auth/auth.guard';
import { AuthInterceptor } from './auth/auth.interceptor';
import { CustomerComponent } from './customer/customer.component';

import { AdminComponent } from './admin/admin.component';
import { HospitalManageComponent } from './admin/hospital-manage/hospital-manage.component';
import { AdminNavigationComponent } from './admin/admin-navigation/admin-navigation.component';
import { DataTablesModule } from 'angular-datatables';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { DoctorManageComponent } from './admin/Doctor/doctor-manage/doctor-manage.component';
import { SweetAlert2Module } from '@toverux/ngx-sweetalert2';
import { CustomerNavigationComponent } from './customer/customer-navigation/customer-navigation.component';
import { MyBookingsComponent } from './customer/my-bookings/my-bookings.component';
import { HospitalDashboardComponent } from './hospital/hospital-dashboard/hospital-dashboard.component';
import { HospitalNavigationComponent } from './hospital/hospital-navigation/hospital-navigation.component';
import { HospitalContainerComponent } from './hospital/hospital-container/hospital-container.component';
import { SearchDoctorComponent } from './customer/search-doctor/search-doctor.component';

@NgModule({
  declarations: [
    AppComponent,
    CustomerComponent,
    AdminComponent,
    HospitalManageComponent,
    AdminNavigationComponent,
    ConfirmationDialogComponent,
    DoctorManageComponent,
    CustomerNavigationComponent,
    MyBookingsComponent,
    HospitalDashboardComponent,
    HospitalNavigationComponent,
    HospitalContainerComponent,
    SearchDoctorComponent
  ],
  imports: [
    AgmCoreModule.forRoot({
      apiKey: 'AIzaSyC3-w4krEwA1VCGM2YZ4KjZvZFmV6oTkVA'
    }),
    BrowserModule,
    BrowserAnimationsModule,
    NavigationModule,
    AppRoutes,
    RouterModule,
    FormsModule,
    SharedModule,
    ViewsModule,
    ErrorModule,
    FormsModule,
    ReactiveFormsModule,
    CommonModule,
    HttpClientModule,
    DataTablesModule,
    ToastrModule.forRoot(),
    NgbModule.forRoot(),
    SweetAlert2Module.forRoot()
  ],
  providers: [
    ConfirmationDialogService,
    UserService,
    DoctorService,
    AuthGuard,
    {
      provide: HTTP_INTERCEPTORS,
      useClass: AuthInterceptor,
      multi: true
    }
  ],
  entryComponents: [ConfirmationDialogComponent],
  bootstrap: [AppComponent],
  schemas: [NO_ERRORS_SCHEMA, CUSTOM_ELEMENTS_SCHEMA]
})
export class AppModule {}

路由页面

import { DoctorManageComponent } from './admin/Doctor/doctor-manage/doctor-manage.component';
import { HospitalManageComponent } from './admin/hospital-manage/hospital-manage.component';
import { AdminComponent } from './admin/admin.component';
import { Map1Component } from './views/maps/map1/map1.component';
import { ModalsComponent } from './views/modals/modals.component';
import { BasicTableComponent } from './views/tables/basic-table/basic-table.component';
import { Profile1Component } from './views/profile/profile1/profile1.component';
import { RouterModule, Route } from '@angular/router';
import { ModuleWithProviders } from '@angular/core';
import { NotFoundComponent } from './views/errors/not-found/not-found.component';
import { Dashboard1Component } from './views/dashboards/dashboard1/dashboard1.component';
import { UserComponent } from './user/user.component';
import { SignInComponent } from './user/sign-in/sign-in.component';
import { SignUpComponent } from './user/sign-up/sign-up.component';
import { AuthGuard } from './auth/auth.guard';
import { AdminPanelComponent } from './admin-panel/admin-panel.component';
import { ForbiddenComponent } from './forbidden/forbidden.component';
import { HomeComponent } from './home/home.component';
import { CustomerComponent } from './customer/customer.component';
import { SearchDoctorComponent } from './Customer/search-doctor/search-doctor.component';
import { MyBookingsComponent } from './customer/my-bookings/my-bookings.component';

const routes: Route[] = [
  { path: 'home', component: HomeComponent, canActivate: [AuthGuard] },
  // Admin Routing start
  {
    path: 'admin',
    component: AdminComponent,
    children: [{ path: 'HospitalManage', component: HospitalManageComponent }]
  },
  {
    path: 'admin',
    component: AdminComponent,
    children: [{ path: 'DoctorManage', component: DoctorManageComponent }]
  },
  // Admin Routing end
  {
    path: 'forbidden',
    component: ForbiddenComponent,
    canActivate: [AuthGuard]
  },
  {
    path: 'adminPanel',
    component: AdminPanelComponent,
    canActivate: [AuthGuard],
    data: { roles: ['Admin'] }
  },
  {
    path: 'signup',
    component: UserComponent,
    children: [{ path: '', component: SignUpComponent }]
  },
  {
    path: 'Customer',
    component: CustomerComponent,
    children: [{ path: 'SignIn', component: SignInComponent }]
  },
  {
    path: 'Customer',
    component: CustomerComponent,
    children: [{ path: 'Register', component: SignUpComponent }]
  },
  {
    path: 'customer',
    component: CustomerComponent,
    children: [{ path: 'bookings', component: MyBookingsComponent }],
    canActivate: [AuthGuard],
    data: { roles: ['Customer'] }
  },
  {
    path: 'customer',
    component: CustomerComponent,
    children: [{ path: 'search', component: SearchDoctorComponent }]
  },
  {
    path: 'login',
    component: UserComponent,
    children: [{ path: '', component: SignInComponent }]
  },
  // { path: '', redirectTo: '/login', pathMatch: 'full' }
  // ,
  { path: '', pathMatch: 'full', redirectTo: 'customer/search' },
  {
    path: 'dashboards',
    children: [{ path: 'v1', component: Dashboard1Component }]
  },
  {
    path: 'profiles',
    children: [{ path: 'profile1', component: Profile1Component }]
  },
  {
    path: 'tables',
    children: [{ path: 'table1', component: BasicTableComponent }]
  },
  { path: 'maps', children: [{ path: 'map1', component: Map1Component }] },

  { path: 'modals', component: ModalsComponent },
  { path: '**', component: NotFoundComponent }
];

export const AppRoutes: ModuleWithProviders = RouterModule.forRoot(routes);

项目结构

标签： angularangular7ng-modules

Answer 1

新建一个组件，一个一个移动组件内容，公开所有服务，重新导入组件导入文件。工作中。

可能是智能感知导致了问题。