EventEmitter angular 2 catching event and debugging
<p>I have write a simple event emitter but it seems not working, so that's the code:</p>

<h1>AppComponent</h1>

<p>and main app component</p>

<pre><code>@Component({
    selector:'my-app',
    templateUrl:'app/app.component.html',
    styleUrls:['app/app.component.css'],
    directives:[ROUTER_DIRECTIVES,MenuBar],
})
export class AppComponent{
    title:'My App'
    activated(event:Routes){
        console.log('activated');
        console.log(received)
    }
}
</code></pre>

<h1>AppComponent.html</h1>

<pre><code>&lt;h1&gt;{{title}}&lt;/h1&gt;
&lt;menu-bar (activate)="activated($event)"&gt;&lt;/menu-bar&gt;
&lt;div class="router-wrapper"&gt;
    &lt;router-outlet&gt;&lt;/router-outlet&gt;
&lt;/div&gt;
</code></pre>

<h1>Download</h1>

<pre><code>@Component({
    .... component's configurations....
})
class Download implements OnInit{
    ... some attributes and code ...;

    @Output() activate:EventEmitter &lt;Routes&gt;= new EventEmitter&lt;Routes&gt;();
    r:Routes={};
    test(): void{
        console.log('emit start')
        console.log(this.r);
        try{
            this.activate.emit(this.r)
        }
        catch(err){
            console.log(err)
        }
        console.log('sent')
    }
}
</code></pre>

<p>the download component is inside a router-outlet.
So first of all, I see all the console.log messages of the Download component but I see no message in the app component is there any reason? What am I doing wrong?<br>
Second one, I think (but maybe I'm wrong) that the problem is in the message propagations, so I would like to debug the emit and catch the events globally, is it possible? And if it is so, how shall I do that?</p>