feat(router): add an option to rerun guards and resolvers when query changes (#14624)

Closes #14514
Closes #14567

modules/@angular/router/src/config.ts

@@ -8,9 +8,12 @@
 
 import {NgModuleFactory, Type} from '@angular/core';
 import {Observable} from 'rxjs/Observable';
+
+import {ActivatedRouteSnapshot, RouterStateSnapshot} from './router_state';
 import {PRIMARY_OUTLET} from './shared';
 import {UrlSegment, UrlSegmentGroup} from './url_tree';
 
+
 /**
  * @whatItDoes Represents router configuration.
  *
@@ -35,6 +38,9 @@ import {UrlSegment, UrlSegmentGroup} from './url_tree';
  * - `data` is additional data provided to the component via `ActivatedRoute`.
  * - `resolve` is a map of DI tokens used to look up data resolvers. See {@link Resolve} for more
  *   info.
+ * - `runGuardsAndResolvers` defines when guards and resovlers will be run. By default they run only
+ *    when the matrix parameters of the route change. When set to `paramsOrQueryParamsChange` they
+ *    will also run when query params change. And when set to `always`, they will run every time.
  * - `children` is an array of child route definitions.
  * - `loadChildren` is a reference to lazy loaded child routes. See {@link LoadChildren} for more
  *   info.
@@ -327,6 +333,13 @@ export type LoadChildren = string | LoadChildrenCallback;
  */
 export type QueryParamsHandling = 'merge' | 'preserve' | '';
 
+/**
+ * @whatItDoes The type of `runGuardsAndResolvers`.
+ * See {@link Routes} for more details.
+ * @experimental
+ */
+export type RunGuardsAndResolvers = 'paramsChange' | 'paramsOrQueryParamsChange' | 'always';
+
 /**
  * See {@link Routes} for more details.
  * @stable
@@ -346,6 +359,7 @@ export interface Route {
   resolve?: ResolveData;
   children?: Routes;
   loadChildren?: LoadChildren;
+  runGuardsAndResolvers?: RunGuardsAndResolvers;
 }
 
 export function validateConfig(config: Routes, parentPath: string = ''): void {
@@ -362,8 +376,8 @@ function validateNode(route: Route, fullPath: string): void {
     throw new Error(`
       Invalid configuration of route '${fullPath}': Encountered undefined route.
       The reason might be an extra comma.
-       
-      Example: 
+
+      Example:
       const routes: Routes = [
         { path: '', redirectTo: '/dashboard', pathMatch: 'full' },
         { path: 'dashboard',  component: DashboardComponent },, << two commas

modules/@angular/router/src/index.ts

@@ -7,7 +7,7 @@
  */
 
 
-export {Data, LoadChildren, LoadChildrenCallback, ResolveData, Route, Routes} from './config';
+export {Data, LoadChildren, LoadChildrenCallback, ResolveData, Route, Routes, RunGuardsAndResolvers} from './config';
 export {RouterLink, RouterLinkWithHref} from './directives/router_link';
 export {RouterLinkActive} from './directives/router_link_active';
 export {RouterOutlet} from './directives/router_outlet';

modules/@angular/router/src/router.ts

@@ -22,7 +22,7 @@ import {mergeMap} from 'rxjs/operator/mergeMap';
 import {reduce} from 'rxjs/operator/reduce';
 
 import {applyRedirects} from './apply_redirects';
-import {QueryParamsHandling, ResolveData, Route, Routes, validateConfig} from './config';
+import {QueryParamsHandling, ResolveData, Route, Routes, RunGuardsAndResolvers, validateConfig} from './config';
 import {createRouterState} from './create_router_state';
 import {createUrlTree} from './create_url_tree';
 import {RouterOutlet} from './directives/router_outlet';
@@ -35,7 +35,7 @@ import {ActivatedRoute, ActivatedRouteSnapshot, RouterState, RouterStateSnapshot
 import {PRIMARY_OUTLET, Params, isNavigationCancelingError} from './shared';
 import {DefaultUrlHandlingStrategy, UrlHandlingStrategy} from './url_handling_strategy';
 import {UrlSerializer, UrlTree, containsTree, createEmptyUrlTree} from './url_tree';
-import {andObservables, forEach, merge, waitForMap, wrapIntoObservable} from './utils/collection';
+import {andObservables, forEach, merge, shallowEqual, waitForMap, wrapIntoObservable} from './utils/collection';
 import {TreeNode} from './utils/tree';
 
 declare let Zone: any;
@@ -180,7 +180,6 @@ type NavigationParams = {
   source: NavigationSource,
 };
 
-
 /**
  * Does not detach any subtrees. Reuses routes as long as their route config is the same.
  */
@@ -799,7 +798,8 @@ export class PreActivation {
 
     // reusing the node
     if (curr && future._routeConfig === curr._routeConfig) {
-      if (!equalParamsAndUrlSegments(future, curr)) {
+      if (this.shouldRunGuardsAndResolvers(
+              curr, future, future._routeConfig.runGuardsAndResolvers)) {
         this.checks.push(new CanDeactivate(outlet.component, curr), new CanActivate(futurePath));
       } else {
         // we need to set the data
@@ -833,6 +833,23 @@ export class PreActivation {
     }
   }
 
+  private shouldRunGuardsAndResolvers(
+      curr: ActivatedRouteSnapshot, future: ActivatedRouteSnapshot,
+      mode: RunGuardsAndResolvers): boolean {
+    switch (mode) {
+      case 'always':
+        return true;
+
+      case 'paramsOrQueryParamsChange':
+        return !equalParamsAndUrlSegments(curr, future) ||
+            !shallowEqual(curr.queryParams, future.queryParams);
+
+      case 'paramsChange':
+      default:
+        return !equalParamsAndUrlSegments(curr, future);
+    }
+  }
+
   private deactiveRouteAndItsChildren(
       route: TreeNode<ActivatedRouteSnapshot>, outlet: RouterOutlet): void {
     const prevChildren: {[key: string]: any} = nodeChildrenAsMap(route);