oop - How to pass values from one class's method to another class's method in Typescript? -

i'm new object oriented programming , assuming should easy concept seasoned oo programmers, i'm struggling it.

in angular2 app have httpservice class shown below:

http.service.ts

@injectable() export class httpservice {     constructor(private http: http) { }     addleaf(parentid, label, name){           var headers = new headers();         headers.append('content-type', 'application/json');         return this.http.post('http://localhost:8000/addleaf/',          {'parentid':parentid,'label':label, 'name':name},         { headers: headers })         .map(res => res).subscribe();           } 

i try call method within class below:

leaf.ts

import { httpservice } './http.service';  export class leaf{ name: string; ... http: http;  // unsure these 2 lines private httpservice: httpservice = new httpservice(this.http) constructor(input){     this.name = input.name; ... add(){     //what should go here?     this.httpservice.addleaf(this.id, this.label, this.name);      //error -> cannot read property 'post' of undefined } 

reading this, tried creating instance of httpservice class error post function not exist. no luck putting httpservice in constructor.

i call method in html this:

(click)="leaf.add()" 

edit: following @peeskillet's answer modified leaf.ts , added leaf.component.ts shown:

leaf.ts

export class leaf{     name: string;     ...     constructor(input){         this.name = input.name;         ...     add(){         //what should go here?     } } 

leaf.component.ts

@component({     providers: [httpservice],  })  export class leafcomponent {     leaf: leaf;     constructor(private httpservice: httpservice) {         this.httpservice.addleaf(this.leaf.id, this.leaf.type, this.leaf.name)      } } 

service works fine if write pre-defined strings in place of params, still not sure how can pass parameters of clicked leaf this.

with angular, use dependency injection , inversion of control. means not create service ourselves, let angular create it. ask service, angular resolve dependencies service has. take example

@injectable() class service {   constructor(private http: http) {} } 

here, service has dependency in http. http not can grab out of thin air. can't do

let service = new service(new http()); 

http dependent on other services. here constructor looks like

class http {   constructor(backend: connectionbackend, options: requestoptions) {}  } 

you might think maybe can instantiate connectionbackend , requestoptions

new http(new connectionbackend(), new requestoptions())` 

but can't either, connectionbackend has required dependencies. it's reason use inversion of control. add service container, , when ask service, angular look service, see requires, http, , see http requires connectionbackend , requestoptions, etc, , angular create items, looking in registry items , putting them voltron. give service, populated.

so add our service container, first need add injectable decorator on service

@injectable() class service {   constructor(private http: http) {} } 

then need add @ngmodule.providers

@ngmodule({   imports: [ httpmodule ],   providers: [ service ] }) class appmodule {} 

now, whenever ask service, populated http (which in httpmodule).

how ask service through constructor of either service or component (directive, pipe, etc)

@component({ }) class mycomponent {   constructor(private service: service) {} } 

by seeing service type constructor argument, angular knows service in container, pass through us. basics of dependency injection , inversion of control.

in case of leaf. if is meant service, can same

@injectable() class leaf {   constructor(private service: service) {} }  @ngmodule({   imports: [ httpmodule ],   providers: [ leaf, service ] }) class appmodule {} 

if don't want add leaf provider, don't need to. do

@component({}) class mycomponent {   leaf: leaf;    constructor(private service: service) {     this.leaf = new leaf(service);   } }