javascript - Angular2: Send data from one component to other and act with the data -


i'm learning angular2. in order that, have 2 components, on click of 1 of components, other component should notified , act that.

this code far:

export class jsontextinput {   @output() rendernewjson: eventemitter<object> = new eventemitter()   json: string = '';    process () {       this.rendernewjson.next(this.json)   } } 

the process function being called on click on first component. on second component have code:

export class jsonrendered {   @input() jsonobject: object    ngonchanges () {     console.log(1)     console.log(this.jsonobject)   } } 

the ngonchanges never runned, dont how pass info 1 component other

edit

there app component parent of 2 components. none of both parent of other

this how clasess now:

export class jsonrendered {   private jsonobject: object    constructor (private jsonchangeservice: jsonchangeservice) {     this.jsonchangeservice = jsonchangeservice     this.jsonobject = jsonchangeservice.jsonobject     jsonchangeservice.statechange.subscribe(json => { this.jsonobject = json; console.log('change made!') })   } }   export class jsontextinput {   json: string = '';    constructor (private jsonchangeservice: jsonchangeservice) {     this.jsonchangeservice = jsonchangeservice   }    process () {     this.jsonchangeservice.jsonchange(this.json)   } } 

and service

import {injectable, eventemitter} '@angular/core'; @injectable() export default class jsonchangeservice {   public jsonobject: object;    statechange: eventemitter<object> = new eventemitter<object>();    constructor(){     this.jsonobject = {};   }    jsonchange(obj) {     console.log('sending', obj)     this.jsonobject = obj     this.statechange.next(this.jsonobject)   } 

}

create service so...

    import {injectable, eventemitter} 'angular2/core'; @injectable() export class myservice {    private searchparams: string[];    statechange: eventemitter<any> = new eventemitter<any>();    constructor(){      this.searchparams = [{}];           }        change(value) {      this.searchparams = value;     this.statechange.next(this.searchparams);            }  } 

then in component...

import {component} 'angular2/core'; import {myservice} './myservice';      @component({   selector: 'my-directive',   pipes: [keyvaluefilterpipe],   templateurl: "./src/sometemplate.html",   providers: [myservice]      })  export class mydirective {    public searchparams: string[];    constructor(private myservice: myservice) {       this.myservice = myservice;       myservice.statechange.subscribe(value => { this.searchparams = value; console.log('change made!') })   }  change(){    this.myservice.change(this.searchparams);  }  } 

you have subscribe eventemitter, update variable. change event in service fired of like...

 (click)="change()" 

Comments

Popular posts from this blog

ios - RestKit 0.20 — CoreData: error: Failed to call designated initializer on NSManagedObject class (again) -

java - Digest auth with Spring Security using javaconfig -

laravel - PDOException in Connector.php line 55: SQLSTATE[HY000] [1045] Access denied for user 'root'@'localhost' (using password: YES) -