Xtykutl

I have a few Angular projects that are using services and working completely fine, but for the life of my I can't figure out what's going on with this one. Every time the app loads up, I get this error message:

Unhandled Promise rejection: StaticInjectorError(Uu)[e -> t]: 

  StaticInjectorError(Platform: core)[e -> t]: 

    NullInjectorError: No provider for t! ; Zone: <root> ; Task: Promise.then ; 

Value: Error: StaticInjectorError(Uu)[e -> t]: 

  StaticInjectorError(Platform: core)[e -> t]: 

    NullInjectorError: No provider for t!

After a lot of Googling and StackOverflowing, I've determined there's an issue with the way the service is being provided to the components or app. I've tried adding the services to my app.module.ts:

import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';

import { BrowserModule } from '@angular/platform-browser';

import { FormsModule } from '@angular/forms';



import { NgModule } from '@angular/core';

import { OnsenModule, OnsNavigator, Params } from 'ngx-onsenui';



import { AuthService } from './services/auth.service';



import { NavigatorComponent } from './pages/appnavigator';

import { LoginComponent } from './pages/login/login.component';

import { PickdrillComponent } from './pages/pickdrill/pickdrill.component';

import { RecordmeasurementsComponent } from './pages/recordmeasurements/recordmeasurements.component';



@NgModule({

  declarations: [

    NavigatorComponent,

    LoginComponent,

    PickdrillComponent,

    RecordmeasurementsComponent

  ],

  entryComponents: [

    LoginComponent,

    PickdrillComponent,

    RecordmeasurementsComponent

  ],

  imports: [

    BrowserModule,

    OnsenModule,

    FormsModule

  ],

  providers: [

    AuthService

  ],

  bootstrap: [ NavigatorComponent ],

  schemas: [ CUSTOM_ELEMENTS_SCHEMA ]

})

export class AppModule {

}

And I've tried removing them from the app.module.ts and defining them as a provider on each individual component, but I still get the same error. Here's a component example.

import { Component, OnInit } from '@angular/core';

import { OnsNavigator } from 'ngx-onsenui';

import { PickdrillComponent } from '../pickdrill/pickdrill.component';

import { User } from '../../models/user.model';



import { AuthService } from '../../services/auth.service';



@Component({

  selector: 'ons-page[login]',

  templateUrl: './login.component.html',

  styleUrls: ['./login.component.css'],

  providers: [ AuthService ]

})

export class LoginComponent implements OnInit {

  username: string;

  password: string;

  errorMessage: string;



  constructor(

    private authService: AuthService,

    private navi: OnsNavigator

  ) { }



  ngOnInit() {

  }



  async login() {

    // calling the AuthService, yadda yadda yadda

  }



}

If I remove the services from my components and build the app, every thing works great, so I've narrowed it down to adding these services to a component. Any help would be much appreciated.

EDIT: Whoops! Forgot to post the service itself. Here's auth.service.ts:

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

import { Http } from '@angular/http';



import { BaseService } from './base.service';

import { User } from '../models/user.model';



@Injectable()

export class AuthService extends BaseService {

  constructor(protected http: Http) {

    super(http);

  }



  async login(user: User) {

    return this.post('login', user, true);

  }



  async forgotPassword(email: string) {

    return this.post('forgotPassword', {email: email}, true);

  }



  async resetPassword(password: string, resetToken: string) {

    return this.post('resetPassword', {password: password}, false, resetToken);

  }



  async register(user) {

    return this.post('register', user, true);

  }



  logout() {

    localStorage.removeItem('Authorization');

    sessionStorage.removeItem('Authorization');

  }

}

That of course pulls from a base service with a constructor requiring Http.

So, I got an answer and unfortunately, I don't know how much help it will be to others. I am building the app using cordova via

c:/angulardirectory/cordova/cordova run browser

This kicks off an angular build via a hook:

ng build --prod --output-path cordova/www/ --base-href .

There must have been something lost there, because once I went up a directory an ran an angular serve, everything started working again. That's the only change I can find that I made. Super weird.

c:/angulardirectory/ng serve