Anonymous - 2015-01-13

Originally posted by: dwmkerr

Suggested approach:

  1. Create a modal which represents the 'frame' of the wizard, with forward/backward buttons.
  2. Include an ng-include in the frame which will include the page the wizard is on.
  3. Define a page as a small object which defines the controller and template.
  4. When each page is constructed, inject a wizardState object into the controller, this represents the state of the overall process that is being run through. Each page is created/destroyed as needed, and reinitialises itself based on the state object.
  5. Each page can enable/disable/set the text of the forward backward buttons, but pressing them invokes the frame controller, replacing the ng-include with the next page in the list (or dismissing the modal and returning the wizard state).