title: Angular2 routing and saving/restoring navigation state
body: <p>With angular 2 I can easily navigate between different views based on my router setup. When moving back and forth, my views will typically reflect their status based on their url parameters.
  For example, when navigate from "<a href="http://orders" rel="nofollow">http://orders</a>" to "<a href="http://order/1" rel="nofollow">http://order/1</a>" then to "<a href="http://customer/304" rel="nofollow">http://customer/304</a>", then hitting back navigates to "<a href="http://order/1" rel="nofollow">http://order/1</a>" and the corresponding view component does no need to know anything else but the url parameter to set its state.</p>
  
  <p>However, there are situations when a view's state reflects more than just what is in the url parameter when it was called and I am trying to understand how this should be done the angular 2 way. 
  (Note that WPF has a concept where pages can store their state in an object which gets added to the navigation journal entry).</p>
  
  <p><strong>Example 1:</strong>
  I want to create a new order by navigating to "<a href="http://order/new" rel="nofollow">http://order/new</a>" ('new' being a trigger keyword for the view to start with a new order), then enter some data and realize that a new customer needs to be created rather than just selecting one. This navigates to "<a href="http://customer/new" rel="nofollow">http://customer/new</a>" and when done would navigate back. How would the customer view properly restore its state (i.e. restore the data that was entered).
  (Note that WPF calls this a page-function).</p>
  
  <p><strong>Example 2:</strong>
  When I drill down from a list view (all orders) into a detail view (single order), then users should be able to move to the next/prev order from within the detail view, but this should not be a browser history entry, i.e. clicking back goes back to the list (people familiar with JIRA may know this; from a list of issues, you can drill down into one issue, but then navigate to the next/prev issue). The view is therefore called with something like "<a href="http://order/Current/1" rel="nofollow">http://order/Current/1</a>" (where 'Current' refers to the list and '1' is the index), the user clicks next to show the 2nd order in the list and then drills-down to its customer. How can clicking back from the customer return to the 2nd item, not the 1st? Alternatively, this may be resolved with manipulating the url, so the next button  would update the url to "<a href="http://order/Current/2" rel="nofollow">http://order/Current/2</a>" without adding a history entry.</p>
  
  <p>Previous (older) discussions regarding this matter have either stated that it may be added later or pointed to libraries, such as @ngrx/store.</p>
  
  <p>Help regarding concepts how to handle this with angular 2 routing would be highly appreciated.</p>