Created a simple component now i get an error about a provider

Question

doing this project and i created a simple component to place my allert, and now i have this error, that i cant solve:

StaticInjectorError(AppModule)[DiscountAllertComponent]: StaticInjectorError(Platform: core)[DiscountAllertComponent]: NullInjectorError: No provider for DiscountAllertComponent!

I created the component like i always do, and i dont understand what i have to do to fix it!

component:

import { Component, OnInit } from '@angular/core';
import {AngularFireDatabase} from '@angular/fire/database';
import {AlertController} from '@ionic/angular';
import {Router} from '@angular/router';

@Component({
  selector: 'app-discount-allert',
  templateUrl: './discount-allert.component.html',
  styleUrls: ['./discount-allert.component.scss'],
})
export class DiscountAllertComponent implements OnInit {

  constructor(
      // public af: AngularFireDatabase,
              public alertController: AlertController) { }

  ngOnInit() {}
}

component module:

mport {CUSTOM_ELEMENTS_SCHEMA, NgModule} from '@angular/core';
import {CommonModule} from '@angular/common';
import {SharedHeaderComponent} from './shared-header/shared-header.component';
import {AlertController, IonicModule} from '@ionic/angular';
import {UserInfoComponent} from './user-info/user-info.component';
import {AddressComponent} from './address/address.component';
import {FormsModule, ReactiveFormsModule} from '@angular/forms';
import {TranslateModule} from '@ngx-translate/core';
import {PasswordStrengthBarModule} from 'ng2-password-strength-bar';
import {SchedulerComponent} from './scheduler/scheduler.component';
import {OrderConfigurationComponent} from './order-configuration/order-configuration.component';
import {OrderComponent} from './order/order.component';
import {MenuComponent} from './menu/menu.component';
import {DishOptionsComponent} from './dish-options/dish-options.component';
import {PasswordResetComponent} from './password-reset/password-reset.component';
import {OrderResumeComponent} from './order-resume/order-resume.component';
import {PaymentMethodComponent} from './payment-method/payment-method.component';
import {OnlinePaymentComponent} from './online-payment/online-payment.component';
import {PipesModule} from '../pipes/pipes.module';
import {ChangePasswordComponent} from './change-password/change-password.component';
import {CardsManagerComponent} from './cards-manager/cards-manager.component';
import {LocationSelectComponent} from './location-select/location-select.component';
import {MbrefComponent} from './mbref/mbref.component';
import {MbwayComponent} from './mbway/mbway.component';
import {CardModule} from '../directives/card/module';
import {DiscountAllertComponent} from './discount-allert/discount-allert.component';

const COMPONENTS = [
  AddressComponent,
  CardsManagerComponent,
  ChangePasswordComponent,
  DishOptionsComponent,
  LocationSelectComponent,
  MbrefComponent,
  MbwayComponent,
  MenuComponent,
  OrderComponent,
  OrderConfigurationComponent,
  OrderResumeComponent,
  PasswordResetComponent,
  SchedulerComponent,
  SharedHeaderComponent,
  UserInfoComponent,
  PaymentMethodComponent,
  OnlinePaymentComponent,
  DiscountAllertComponent
];

@NgModule({
  declarations: [COMPONENTS],
  imports: [
    IonicModule,
    CardModule,
    CommonModule,
    FormsModule,
    PasswordStrengthBarModule,
    ReactiveFormsModule,
    TranslateModule,
    PipesModule,

  ],
  schemas: [CUSTOM_ELEMENTS_SCHEMA],
  exports: [COMPONENTS],
  entryComponents: [COMPONENTS],
})
export class ComponentsModule {
}

I think the problem is the alertController injection. Can you try to remove it from the constructor and comment code which use this dependency ? Can you also provide AlertController code ? At least the beginning of the file, not all the functions — Gauthier T., Aug 31 '20 at 10:39

score 0 · Answer 1 · answered Aug 31 '20 at 11:55

0

When you create a component for a page, you have to declare it in .module.ts file in declarations: [] of the page that you are using. Eg.

declarations: [DiscountAllertComponent]

If still does not work, try to add it in:

  entryComponents: [DiscountAllertComponent]

answered Aug 31 '20 at 11:55

Volvo

56
2
11

It is on declarations, – Drprince100 100 Aug 31 '20 at 12:44
@drprince100 try adding providers in the module and see if that helps. https://stackoverflow.com/questions/47380239/nullinjectorerror-no-provider-for-angularfirestore – Volvo Aug 31 '20 at 16:09

Created a simple component now i get an error about a provider

1 Answers1