Angular2 : How to refresh resolver dependent components?
<p>I have three components, each have their own resolver that fetch data from a different API.
To do so, these components rely on an url, that is shared between them using a service.</p>

<p>I want that when a change to that url happens, each components reloads itself, i.e to restart the resolvers.</p>

<p>I had a look at several related S.O questions, but none mention how to do so when using resolvers, cf : <a href="https://stackoverflow.com/questions/35105374/how-to-force-a-components-re-rendering-in-angular-2">question 1</a>,<a href="https://stackoverflow.com/questions/40467497/angular-2-reload-component-based-on-activated-route">question 2</a>,<a href="https://stackoverflow.com/questions/37972508/how-to-reload-refresh-all-the-current-components-in-angularjs2">question 3</a></p>

<p>I can think of two ways :</p>

<p>The dirty way : Force the refreshing of the component using a router redirect and a blank component.</p>

<pre><code>this.router.navigateByUrl('blank',true);
this.router.navigateByUrl('home/(mapps:mobil//sw:simil//sf:sales)');
</code></pre>

<p>But that didn't work. There is a refresh, but the resolvers aren't...resolved.</p>

<p>The other way : use a BehaviorSubject or a ChangeDetectorRef. 
But then, I am clueless as to how to achieve it, considering detecting changes within my components won't help me actually restart the resolvers.</p>

<p>My feeling is that this has to be done through the router somehow, because it is the one knowing about the resolvers :</p>

<pre><code>const routes: Routes = [
  {
    path: '',
    redirectTo: 'home',
    pathMatch: 'full'
  },
  {
    path: 'home',
    component: HomeComponent,
    children : [
      {
        path: '',
        component: BlankComponent
      },
      {
        path: 'simil',
        component: SwComponent,
        outlet: 'sw',
        resolve: {
          data: SwResolve
        }
      },
      {
        path: 'sales',
        component: SalesComponent,
        outlet: 'sf',
        resolve: {
          data: SalesResolve
        }
      }
    ]
  },
  {
    path: 'blank',
    component: BlankComponent
  }
];
</code></pre>

<p>Any hints on how to achieved this ?</p>

<p>Edit : Here is the <a href="https://plnkr.co/edit/UZiWCMqASoyWCnJHiU3w?p=preview" rel="noreferrer">related plunkr</a></p>

<p>Edit Jun 17 : 
There is no need for the blank component workaround anymore.
To refresh components, simply call back the route :</p>

<p><code>this.router.navigateByUrl('home/(mapps:mobil//sw:simil//sf:sales)')</code></p>