I don't really understand your problem but you could route to a component
that shows all your wizard steps in an *ngFor inside a single component
that you actually route to.
http://stackoverflow.com/questions/36325212/angular-2-dynamic-tabs-with-user-click-chosen-components/36325468#36325468
contains an example how to use DynamicComponentLoader with *NgFor
Could be totally off though...
On Thursday, April 21, 2016 at 1:16:19 AM UTC+2, hani wrote:
>
> So i have a full routing system in place and working, but i noticed since
> it's based on URL you could only navigate to one view at a time. Since i'm
> writing a wizard, i'll need to review the wizard steps before submission to
> server. The review (potentially a step on its own) should show all the
> steps at the same time. This is an issue since wizard steps are configured
> to be routed and i have no idea how to show them at the same time.
>
> I've tried to create a preview step and imported all the steps that need
> previewing, but that made new instances of each step and hence no data to
> preview. Here is a sample code for a preview step:
>
> import {Component} from 'angular2/core';
>
> import {Step1} from './step1';
> import {Step2} from './step2';
>
>
> @Component({
> selector: 'preview',
> directives: [Step1, Step2], //Oops! new instances go in here. Not
> helpful
> template: '<div><step1>Loading step1...</step1><step2>Loading
> step2...</step2></div>'
> })
> export class Preview {
>
> }
>
> And here's a code for the wizard:
>
>
>
> import {Component} from 'angular2/core';
> import {RouteConfig, Router} from 'angular2/router';
>
> import {Step1} from './step1';
> import {Step2} from './step2';
> import {Preview} from './preview';
>
>
>
> @RouteConfig([
> { path: '/step1', name: 'step1', component: Step1, useAsDefault: true
> }, { path: '/step2', name: 'step2', component: Step2 },
> { path: '/preview', name: 'preview', component: Preview}
>
> ])
> @Component({
> selector: 'preview',
> template: '<div><button type="button"
> (click)="navigate()">Navigate</button><button type="button"
> (click)="preview()">Preview</button><router-outlet></router-outlet></div>'
> })
> export class Wizard {
> constructor(private _router: Router) { }
>
>
> navigate() {
> this._router.navigate(['step2']);
> }
> preview() {
> this._router.navigate(['preview']);
> }
> }
>
>
> I'm not even sure if have a separate step for previewing is the way to go
> in Angular2, so I appreciate any feedback on how Angular2 solves such
> problems.
>
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
