html - angular2: Supplied parameters do not match any signature of call target, even though i have all the needed params -

push.component.ts

import { component, oninit } '@angular/core';  import {pushresult}        './dto/pushresult'; import {pushrequest}       './dto/pushrequest'; import {pushservice}       './push.service';  @component({     // selector: 'push-comp',     template:       //   `<form (submit)="submitform()">       //   <input [(ngmodel)]="element.name"/>       //       //   <button type="submit">submit form</button>       // </form>       // <br>     `<button (click)="getheroes()"> </button> <button (click)="saveheroes()"> push </button>`,     // templateurl: 'app/html/heroes.component.html',     providers: [pushservice] }) export class pushcomponent implements oninit {     pushresult:pushresult;     // selectedhero:hero;     // addinghero = false;     error:any;     element:any;      constructor(private pushservice:pushservice) {         console.info("in pushcomponent constructor()");      }      getheroes() {         this.pushservice             .dosomeget();             // .then(pushresult => this.pushresult = pushresult)             // .catch(error => this.error = error);     }       saveheroes() {         var pushrequest: pushrequest = new pushrequest();         // this.pushservice.doselectmessagesattributesurl2(pushrequest);         this.pushservice.dofeaturecreatenewmessageurl(pushrequest);         this.pushservice.dofeatureselectpushmessages(this.element);         // .then(pushresult => this.pushresult = pushresult)         // .catch(error => this.error = error);     }          ngoninit() {         console.info("in pushcomponent ngoninit()");        //  this.getheroes();        //   this.saveheroes();     }  } 

push.service.ts

import { injectable }             '@angular/core'; import {http, response, headers}  '@angular/http';  import 'rxjs/add/operator/topromise'; import 'rxjs/rx'; import { pushresult } './dto/pushresult'; import {pushrequest} './dto/pushrequest'; import {stringutilsservice} "../shared/stringutils.service";   @injectable() export class pushservice {     //private pushurl = 'http://www.ynet.com';  // url web api     //  private geturl = '/app/eladb.json';  // url web api     private geturl = '/supportool/showconfig?id=4';  // url web api     private selectmessagesattributesurl = '/supportool/push/selectmessagesattributes';  // url web api     private postmultimap = '/supportool/push/featurecreatenewmessage';  // url web api     private postboolean = '/supportool/push/featureselectpushmessages';  // url web api      private stringutilsservice : stringutilsservice;      constructor(private http: http) {         this.stringutilsservice = new stringutilsservice();     }      dosomeget() {         console.info("sending request");           let headers = new headers({             'content-type': 'application/xml'});           this.http.get(this.geturl, {headers: headers})             .map(res => res.text())             .subscribe(                 data => { console.info("next: "+data) },                 err => console.error(err)             );     }      doselectmessagesattributesurl2(pushrequest : pushrequest) {         console.info("sending post request");          let headers = new headers({             'content-type': 'application/x-www-form-urlencoded;charset=utf-8'});          return this.http             .post(this.selectmessagesattributesurl, "", {headers: headers})             .map(res => res.json())             .subscribe(                 data => { console.info("next: "); console.info(data) },                 err => console.error(err)             );     }       dofeaturecreatenewmessageurl(pushrequest : pushrequest) {         console.info("sending post request");          let headers = new headers({             'content-type': 'application/x-www-form-urlencoded'});          var islimit = true;          return this.http             .post(this.postboolean, "#limit="+islimit, {headers: headers})             .map(res => res.json())             .subscribe(                 data => { console.info("next: "); console.info(data) },                 err => console.error(err)             );     }      dofeatureselectpushmessages(element : any) {         console.info("sending post request");          let dict = {"limit":"true", "name":"foo"}           let headers = new headers({             'content-type': 'application/x-www-form-urlencoded'});           var params = {};         params['push_input_internal_id'] = "1";         params['b'] = "2";          var formparamstring = this.stringutilsservice.maptoformparamsstring(params);          return this.http             .post(this.postmultimap, formparamstring , {headers: headers})             .map(res => res.json())             .subscribe(                 data => { console.info("next: "); console.info(data) },                 err => console.error(err)             );     }      private handleerror(error: any) {         console.error('an error occurred', error);         // return promise.reject(error.message || error);     } } 

push.component.spec.ts

import { }           '@angular/platform-browser'; import { debugelement } '@angular/core'; import { addproviders, async, inject } '@angular/core/testing'; import { pushcomponent } './push.component';  describe('component: push', () => {   it('should create instance', () => {     let component = new pushcomponent();     expect(component).tobetruthy();   }); }); 

app.routing.ts

import { modulewithproviders }  '@angular/core'; import { routes, routermodule } '@angular/router';  import { pushcomponent }      './push/push.component';   const approutes: routes = [   { path: '', redirectto: '/push', pathmatch: 'full' },   { path: 'push',  component: pushcomponent} ];  export const approutingproviders: any[] = [];  export const routing: modulewithproviders = routermodule.forroot(approutes); 

i read post, used work me. cannt understand missing.

and error after npm start

build error

the broccoli plugin: [broccolitypescriptcompiler] failed with: error: typescript found following errors:   /users/eladb/workspaceqa/supportool/src/main/webapp/html/ng2/tmp/broccoli_type_script_compiler-input_base_path-2gtevnc7.tmp/0/src/app/push/push.component.spec.ts (10, 21): supplied parameters not match signature of call target.     @ broccolitypescriptcompiler._doincrementalbuild (/users/eladb/workspaceqa/supportool/src/main/webapp/html/ng2/node_modules/angular-cli/lib/broccoli/broccoli-typescript.js:120:19)     @ broccolitypescriptcompiler.build (/users/eladb/workspaceqa/supportool/src/main/webapp/html/ng2/node_modules/angular-cli/lib/broccoli/broccoli-typescript.js:43:10)     @ /users/eladb/workspaceqa/supportool/src/main/webapp/html/ng2/node_modules/angular-cli/node_modules/broccoli-caching-writer/index.js:152:21     @ lib$rsvp$$internal$$trycatch (/users/eladb/workspaceqa/supportool/src/main/webapp/html/ng2/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:1036:16)     @ lib$rsvp$$internal$$invokecallback (/users/eladb/workspaceqa/supportool/src/main/webapp/html/ng2/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:1048:17)     @ lib$rsvp$$internal$$publish (/users/eladb/workspaceqa/supportool/src/main/webapp/html/ng2/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:1019:11)     @ lib$rsvp$asap$$flush (/users/eladb/workspaceqa/supportool/src/main/webapp/html/ng2/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:1198:9)     @ _combinedtickcallback (internal/process/next_tick.js:67:7)     @ process._tickcallback (internal/process/next_tick.js:98:9) 

pushcomponent expects pushservice instance parameter

constructor(private pushservice:pushservice) { 

but don't provide 1

new pushcomponent(/* parameter value missing */); 

if create instance new xxx() angulars di not involved , no dependencies passed. when angulars di creates pushcomponent resolve , pass dependencies.

import {beforeeachproviders, it, describe, inject} '@angular/core/testing';  describe('my code', () => {   beforeeachproviders(() => [pushservice, pushcomponent]);    it('does stuff', inject([pushcomponent], (pushcomponent) => {     // actual test   }); }); 

don't expect component injected. way instance of components class (without change detection running, nor lifecycle hooks being called, ...)

if want component, need use testbed. see https://github.com/angular/angular/blob/master/changelog.md