ERROR Error: Uncaught (in promise): NullInjectorError: R3InjectorError(RegisterPageModule)[AccessProviders -> AccessProviders]

user_11388954 0
Viewed 24761

I have a problem in my Ionic app with AngularJS, in register.page.ts; when i am going to add the AccessProviders path in the project the project says:ERROR Error: Uncaught (in promise): NullInjectorError: R3InjectorError(RegisterPageModule)[AccessProviders -> AccessProviders -> AccessProviders -> AccessProviders]: NullInjectorError: No provider for AccessProviders!

I have created the access providers folder and files manually.

register.page.ts

import {Router} from "@angular/router";
import { ToastController, LoadingController, AlertController } from "@ionic/angular";
import {AccessProviders} from "../../providers/access-providers";

@Component({
  selector: 'app-register',
  templateUrl: './register.page.html',
  styleUrls: ['./register.page.scss'],
})
export class RegisterPage implements OnInit {

    name: string = "";
    gender: string = "";
    dob: string = "";
    email: string = "";
    password: string = "";
    confirm_password: string = "";
    disabledButton;

  constructor(
      private router: Router,
      private toastCtrl: ToastController,
      private alertCtrl: AlertController,
      private loadingCtrl: LoadingController,
      private accsPrvds: AccessProviders,
  ) { }

  ionViewDidEnter() {
      this.disabledButton = false;
  }

access-providers.ts

import { HttpClient, HttpHeaders, HttpErrorResponse } from "@angular/common/http";
import  'rxjs/add/operator/map';
import  'rxjs/add/operator/timeout';

@Injectable()
export class AccessProviders {
    server: string = 'http://localhost:8100/register'; //should change.

    constructor(
        public http: HttpClient
    ) {

    }

    postData(body, file) {
        let headers = new HttpHeaders({
            'Content-Type': 'application/json; charset=UTF-8'
        });

        let options = {
            headers: headers
        };

        return this.http.post(this.server + file, JSON.stringify(body), options)
            .timeout(59000)// 59 sec timeout
            .map(res => res);
    }
}

How i can solve this problem? I hope got my answer.

ionic5 ionic-framework
6 Answers

ADD blow code inside your access-providers.ts file:

import { Injectable } from '@angular/core'; // at top

@Injectable({
  providedIn: 'root' // just before your class
})
export class AccessProviders {}
user_59090260

Make sure that HttpClientModule is registered at the level of AppModule

user_27736840

Just add this in your app.module.ts

import { HttpClientModule } from '@angular/common/http'
/////
@NgModule({
imports: [ HttpClientModule ]
})
user_19296650

It looks like you need to add it under providers in your app.modules.ts file.

If you only need the class in one page you could add it to the page.module.ts file of the corresponding page.

user_112674940
user_87329720

In your app module

You have to add at the top :

import {AccessProviders} from "../../providers/access-providers";

On the same file, find providers and just add AccessProviders to the list of providers.

user_74532640
Related