Brandereignis in der angular2 Komponente

Question

Ich habe 2 Komponenten:

app.component 
site.component 

Ich mag Veranstaltung von Site-Komponente in App-Komponente fangen. Aber Site-Komponente von Router gemacht (wenn ich auf einige Link klicken) Jetzt im Site-Komponente habe ich:

@Component({ 
    selector: 'app-sites-list', 
    templateUrl: './sites-list.component.html', 
    styleUrls: ['./sites-list.component.css'], 
    outputs: ['counterChange'], 

}) 
export class Sites implements OnInit { 

    public counterChange = new EventEmitter(); 

und im tmplate:

<button type="submit" (click)="check(url.value);">Go</button> 

Also, wie kann ich diese fangen Ereignis in der App-Komponente. Danke

Answer 1

Komponenten, die nicht in einer übergeordneten/untergeordneten Hierarchie liegen, kommunizieren normalerweise über einen injizierbaren Dienst. So etwas wie dies (ich habe diesen Code nicht getestet):

import {Subject} from "rxjs/Rx"; 

@Injectable() 
export class MyService { 

    public notifierSubject:Subject = new Subject(); 

    public notify(something:any) { 
     this.notifierSubject.next(something); 
    } 
} 

In Komponente 1, der Sender:

constructor(myService:MyService) { 
} 

check(value) { 
    this.myService.notify(value); 
} 

In Komponente 2, wobei der Empfänger:

constructor(myService:MyService) { 
    myService.notifierSubject.subscribe(data => { console.log(data); }); 
} 

In diesem Beispiel Ich wählte eine Subject von RxJS. Natürlich können Sie frei wählen, was Sie wollen. Alles, was Sie abonnieren können, sollte den Job machen.