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.
