Newbie using AngularJS 1.5 with ES6, a component-based design and the new Component Router.
Let's consider a simple Survey application. Any given Survey has an instructions page and a list of Questions.
When the end user accesses a given Survey, he must be shown the instructions page. He must then navigate through the different Questions, which may span several pages. Upon reaching the last Question page, he must be shown a summary page with all his answers.
Ideally, I would like to have the following route mappings:
/surveys/:id: alias to/surveys/:id/instructions/surveys/:id/instructions: displays the survey instructions/surveys/:id/entry: displays the survey for entry by the end user/surveys/:id/summary: display a summary of all survey answers entered by the end user
Ideally, the SurveyComponent (mapped to /surveys/:id) would load the Survey on route activation ($onRouterActivate method) and expose the retrieved Survey to its child components through its <ng-outlet/> template tag. The child components, mapped to the correct sub-routes, would then bind to this Survey and render the appropriate display.
I have been unable to achieve this, as it seems that <ng-outlet/> cannot be used to send data to child components.
Is my approach correct and am I missing something? Or is the route/sub-route mechanism inappropriate for this?