Emit events between nested components grandchild to root component

Viewed 1325

I have wheels.component nested to car.component.

wheels.component:

export class WheelsComponent {    
    @Output() onLoaded : EventEmitter<string>() = new EventEmitter<string>();

    private downloadAllFiles(url: string) {
        this.onLoaded.emit('Hello, World 1!');
        //some operations to wait
        this.onLoaded.emit('Hello, World 2!');

    };
}

Component car.component is not written at html page, but called through routing at car-routing.module.ts:

@NgModule({
    imports: [
        RouterModule.forChild([
            {
                path: 'sfactmessage/:id',
                component: CarComponent,
                resolve: {
                    card: cardResolver
                }
            }
        ])
    ],
    exports: [RouterModule]
})
export class CarRoutingModule {}

What I want is to handle event emitted from wheels.component, not at car.component, but at app.component.

Is it possible to handle event at app.component?

The plunker sample is not working (sorry, this is my first plunkr example), but gives a view how my app is arranged.

1 Answers
Related