Ionic with firebase unexpected error

StaticInjectorError[AuthService]:
StaticInjectorError[AuthService]:
NullInjectorError: No provider for AuthService!

please help me i can not understand the error how to fix it

code for authentication service: auth.ts->

import firebase from 'firebase';
import {Injectable} from "@angular/core";

@Injectable()
export class AuthService {
  signup(user: any) {
    return firebase.auth().createUserWithEmailAndPassword(user.email, user.password);
  }



  signin(email: string, password: string) {
    return firebase.auth().signInWithEmailAndPassword(email, password);
  }

  logout() {
    firebase.auth().signOut();
  }

  authStatus() {
    return firebase.auth();
  }

  public getActiveUser() {
    return firebase.auth().currentUser;
  }

  getUserDetails() {
    if (!this.getActiveUser()) return null;
    return firebase.database().ref('students').child(this.getActiveUser().uid);
  }

  saveUserDetails(payload: any) {
      const user = this.getActiveUser();
      if (!user)
        return;

      if (user.photoURL)
        payload.avatar = user.photoURL;

      return firebase.database().ref('students').child(user.uid).update(payload);
  }


  saveTeacherDetails(payload: any){
    const teacher = this.getActiveUser();
    if(!teacher)
    return ;
    return firebase.database().ref('teachers').child(teacher.uid).update(payload);
  }

  getTeacherDetails() {
    if(!this.getActiveUser()) return null;
    return firebase.database().ref('teachers').child(this.getActiveUser().uid);
  }
}

app.component.module.ts->

import { Component, ViewChild } from '@angular/core';
import { Platform, NavController, MenuController } from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';

import { HomePage } from '../pages/home/home';
import { UserPage } from '../pages/user/user';
import { DashboardPage } from '../pages/dashboard/dashboard';
import { DepartmentListPage } from '../pages/department-list/department-list';
import { SigninPage } from '../pages/signin/signin';
import { SubjectsPage } from '../pages/subjects/subjects';
import firebase from 'firebase';
import { AuthService } from '../services/auth';
@Component({
  templateUrl: 'app.html'
})

export class MyApp {
  rootPage:any=HomePage;
  profile=UserPage;
  dashboard=DashboardPage;
  subject=SubjectsPage;
  home= HomePage;
  department_list = DepartmentListPage;
  signinPage=SigninPage;

  isAuthenticated = false;
@ViewChild('nav') nav: NavController;

constructor(platform: Platform,
   statusBar: StatusBar,
    splashScreen: SplashScreen,
    private menuCtrl: MenuController,
    private authService: AuthService) {
  firebase.initializeApp({
   //
//api key 
//
  });
  firebase.auth().onAuthStateChanged(user => {
    if (user) {
      this.isAuthenticated = true;
      this.rootPage = UserPage;
    } else {
      this.isAuthenticated = false;
      this.rootPage = SigninPage;
    }
  });




  platform.ready().then(() => {
    // Okay, so the platform is ready and our plugins are available.
    // Here you can do any higher level native things you might need.
    statusBar.styleDefault();
    splashScreen.hide();
  });
}
onLoad(page: any) {
  this.nav.setRoot(page);
  this.menuCtrl.close();
}

onLogout() {
  this.authService.logout();
  this.menuCtrl.close();
  this.nav.setRoot(SigninPage);
}

}

Import AuthService to app.module.ts and add it to providers array.

2 Likes

Thanks Its working now