RC4 : Can't resolve all parameters for Component:(?)


I know that question is repeated but really i tried all available solutions but still can’t solve my problem.
I have multiple components and a service I imported the service to components like signin,signup,…etc.
but i have one component that make the problem and if i removed the service injection from it application will run perfect.

the Invalid component is :

import {Component,Injectable,Inject} from '@angular/core';
import {CloudAuth} from '../../shared/auth_service';
  selector: 'page-activation',
  templateUrl: 'activation.html'
export class Activation   {
  constructor( @Inject(CloudAuth) public _CloudAuth:CloudAuth ){


one of worked components login.ts

import {Component} from '@angular/core';
import {NavController, NavParams, LoadingController, AlertController, AlertOptions, Platform} from 'ionic-angular';
 import {FormBuilder, Validators, FormGroup} from '@angular/forms';
import {TranslateService} from "ng2-translate";

import {Facebook} from 'ionic-native';
 import {CloudAuth} from '../../shared/auth_service';

  templateUrl: 'login.html',
export class login {
  constructor(public loading: LoadingController, public navCtrl: NavController, public params: NavParams,
              public _userService: UserService, public _FormBuilder: FormBuilder, public translate: TranslateService,
              public alertCtrl: AlertController , public _CloudAuth:CloudAuth) {


My service code is :

import {Injectable , Inject} from "@angular/core";
import { Platform } from 'ionic-angular';
import "rxjs/add/operator/map";
import { JwtHelper } from 'angular2-jwt';
import {TranslateService} from 'ng2-translate/ng2-translate';

import {Activation} from '../user/activation/activation';
import {welcomePage} from '../welcome/welcome';
import {userLogin} from '../user/user';
import {CompleteRegistration} from '../user/completeRegistration/completeRegistration';
import {HomePage} from '../home/home';

export class CloudAuth {
  jwtHelper: JwtHelper = new JwtHelper();
    @Inject(TranslateService) public translate: TranslateService , 
    @Inject(Platform)  public platform: Platform
          this.token = localStorage.getItem('user_token');

        return this.token;
        localStorage.setItem('user_token', newtoken.toString());
        this.token = newtoken;
        return true;
          // Check if token expired
          return this.jwtHelper.isTokenExpired(this.token)
         // Return data stored in token
          if(this.token=='' || this.token == null) return false;
          else return this.jwtHelper.decodeToken(this.token);
          let userData =  this.tokenData();
          if( userData == false) return false;
          else {
              if(userData.activation_code == code) return true;
              else return false; 
      // Check if user login or not and loading the default app Language.
        let lang = localStorage.getItem('Language');
        if(!lang || lang==''|| lang === undefined ) return welcomePage;
        else {
          let userData =  this.tokenData();
          if( this.token==null ||  this.token== '' || userData == false) return userLogin;
          else {
              if(userData.active == 1) {
                  if(!localStorage.getItem('firstRun') ){
                    return CompleteRegistration;
                    return HomePage;
              }else {
                  return Activation;

I removed @Inject decorator but also not working.

My node and ionic information is :

Ionic Framework: 2.0.0-rc.4 
Ionic Native: 2.2.11 
Ionic App Scripts: 0.0.47 
Angular Core: 2.2.1 
Angular Compiler CLI: 2.2.1 
Node: 6.7.0 
OS Platform: macOS Sierra 

this error dose’t appear before it happened since upgrade to Ionic RC4
hope to find a solution.


I have the same exact problem. I’ve tried to isolate the problem by creating a brand new provider via ionic g provider TestProvider. When I inject it into an existing component, it gives the can't resolve all parameters for Component:(?) error.

This is also something that started to occur in RC4. Going to try to upgrade to RC5 to see what happens.


Is your provider declared in the app module?


Of course. Wish it was that simple. The provider in question works existingly in another component of my app.


You should use forwardRef
import {forwardRef} from '@angular/core'; import {CloudAuth} from "CloudAuth.service"

then at the class constructor you should declare the component like :

constructor( @Inject(forwardRef(() => CloudAuth)) public _CloudAuth )

that works for me.


I actually found that the problem is with the way I’m referencing my paths. I use an index.ts to store all my providers, so I reference it. The error is gone if I directly point to the location of the provider. This is perhaps an error with TypeScript not correctly compiling.