typescript - angular2, how to show the same component more than once -

i have wizard component multiple step components, these steps routed wizard component , wizard routed root component. last step of wizard, need show navigated steps @ once reviewing purposes data that's entered while navigating them. how achieve this?

what i've tried:

1. added @injectable() each step component , used angular2 injection provider, no matter i've tried, instantiates new instance , data entries gone.

2. passing hard-coded references around. not terrible , bad practice, thankfully didn't work since can't access prototype properties outside component domain.

all fresh out of options. welcomed!

maintain data in service , bind view service instead of component class, each component show same data.

@injectable() class shareddata {   name:string; }  @component({   selector: 'wiz-step1',   template` <input type="text" [(ngmodel)]="shareddata.name"> `}) export class wizstep1 {   constructor(private shareddata:shareddata) {} }  @component({   selector: 'my-app',   directives: [wizstep1],   providers: [shareddata],   template` <wiz-step1></wiz-step1> <wiz-step1></wiz-step1> `}) export class appcomponent {} 

plunker example

for how use services more complex data see

• updating variable changes in components service angular2

• https://angular.io/docs/ts/latest/cookbook/component-communication.html#!#bidirectional-service