dependency injection - angular2 inject a service to other - error when using @Inject -

this question has answer here:

• angular2 beta dependency injection 3 answers

i using angular2 beta. , getting error when using @inject annotation di 1 service another, not able figure out wrong. seem per angular2 documentation.

i using cloud based data-services - clouddb - application's data needs. clouddb gives me javascript based client library can include in js app , use crud operations in clouddb database or call other custom api have stored in clouddb account, userauth api (api authenticate user's credentials). before using clouddb js client lib api , need supply clouddb account's url , authkey calling clouddb js object's getclient method.

in angualar2 app, created injectable service class - clouddbprovider - store clouddb account url , authkey , call clouddb.getclient set provider's js client object clouddb account.

import {injectable} 'angular2/angular2';  ///<reference path="../typedefs/clouddb.d.ts" /> //typedef of clouddb js library  @injectable() export class clouddbprovider {     private clouddbclient: clouddb.jsclient;      public clouddbclient(): clouddb.jsclient {         return this.clouddbclient;     }       constructor() {         this.clouddbclient = new clouddb.getclient(             "https://myaccount.clouddb.com/",             "acfdsfmyddcmheadfsdsdfhdsf68" // account authkey         );     } } 

now, want create userutils service in angular2 app, want inject above class clouddbclient object. coded userutils service class below, learnt tutorial

import {injectable, inject} 'angular2/angular2'; import {clouddbprovider} './clouddbprovider';  @injectable() export class userutils { private _userdetails: object = {}; private _clouddbprovider: clouddbprovider; private _clouddbclient: microsoft.windowsazure.mobileserviceclient;;  constructor( @inject(clouddbprovider) clouddbprvdr: clouddbprovider) {     this._clouddbprovider = clouddbprvdr;     this._clouddbclient = this._clouddbprovider.clouddbclient;  //the public getter property in class clouddbprovider }  public authenicateuser(p_strusername: string, p_struserpassword: string) {     var p: promise<any> = new promise(         (resolve: (result: any) => void, reject: (err: any) => void) =>             this._clouddbclient.userlogin(p_strusername, p_struserpassword).done( //using api 'userlogin' of clouddb authenticate user against clouddb's users table.                 (loginresult) => {                     alert("from userutils - logged in as: " + loginresult.user.basicprofile.firstname);                     resolve(loginresult);                 },                 (loginerr: any) => {                     alert("error: " + loginerr.request.responsetext);                     reject(loginerr);                 }             )     );      return p; } 

}

then trying use userutils in loginpage component below:

import {component} 'angular2/core'; import {welcomepage}  "../views/welcome/welcome"; import {userutils}  "../services/userutils";   @component({     templateurl: 'app/login/login.html',     providers: [userutils] }) export class loginpage {     private _userutils: userutils;      constructor( userutils: userutils) {         this._userutils = userutils;      }        public loginbuttonclicked(event, username, password) { //called when login button clicked user          //...         //... to-do field value verification          //...          this._userutils.authenicateuser(username, password).then(           (result) => {               //navigate welcomepage           },            (err) => { alert(err); }        );     } }  

the component loginpage doesn't work when use userutils. browser console throws error - no provider clouddbprovider! (loginpage -> userutils -> clouddbprovider)

note that, if move 'authenicateuser' method userutils clouddbprovider directly , use clouddbprovider in loginpage component user authentication, works fine, user gets authenticated , navigated welcome page after login. also, no error thrown , app working if remove @inject(clouddbprovider) clouddbprvdr userutils's constructor cannot use clouddbprovider in userutils, point app doesn't throw error, means wrong @inject.

any clue going wrong?

upto understanding mistake in imports change import of injectablewith this

import {component, inject, injectable} 'angular2/core'; 

also accoriding me when have used @injectable annotation no need use @inject in constructor put service public identifier , can use service method of same class.