feat(Params): Simplify params services by removing select method

Remove the select method from RouteParams and QueryParams. Simplify both services

by giving them an abstract token for DI and a simple projection factory. Remove

the replace method from QueryParams. Add new search method to Location to update

query params.

BREAKING CHANGE: select method removed from QueryParams and RouteParams. Use pluck instead:

  BEFORE:

  ```ts

  routeParams.select('id').subscribe(id => {});

  ```

  AFTER:

  ```ts

  routeParams.pluck('id').subscribe(id => {});

  ```

lib/index.ts

@@ -3,45 +3,42 @@ import { LocationStrategy } from 'angular2/src/router/location/location_strategy
 import { PathLocationStrategy } from 'angular2/src/router/location/path_location_strategy';
 
 import { LOCATION_PROVIDERS } from './location';
-import { ROUTE_PARAMS_PROVIDERS } from './route-params';
 import { ROUTE_SET_PROVIDERS } from './route-set';
 import { ROUTE_VIEW_PROVIDERS } from './route-view';
 import { REDIRECT_PROVIDERS } from './redirect';
 import { ROUTES, Routes } from './route';
 import { GUARD_PROVIDERS } from './guard';
 import { MATCH_ROUTE_PROVIDERS } from './match-route';
 import { COMPONENT_RENDERER_PROVIDERS } from './component-renderer';
-import { QUERY_PARAMS_PROVIDERS } from './query-params';
 import { LINK_TO_PROVIDERS } from './link-to';
 import { LINK_ACTIVE_PROVIDERS } from './link-active';
+import { PARAMS_PROVIDERS } from './params';
 
 export function provideRouter(routes: Routes) {
   return [
     provide(LocationStrategy, { useClass: PathLocationStrategy }),
     provide(ROUTES, { useValue: routes }),
     LOCATION_PROVIDERS,
-    ROUTE_PARAMS_PROVIDERS,
     ROUTE_SET_PROVIDERS,
     ROUTE_VIEW_PROVIDERS,
     REDIRECT_PROVIDERS,
     GUARD_PROVIDERS,
     MATCH_ROUTE_PROVIDERS,
     COMPONENT_RENDERER_PROVIDERS,
-    QUERY_PARAMS_PROVIDERS,
     LINK_TO_PROVIDERS,
-    LINK_ACTIVE_PROVIDERS
+    LINK_ACTIVE_PROVIDERS,
+    PARAMS_PROVIDERS
   ];
 }
 
 
 export { Guard, createGuard } from './guard';
 export { LocationChange, Location } from './location';
 export { Middleware, createMiddleware } from './middleware';
-export { RouteParams } from './route-params';
+export { RouteParams, QueryParams } from './params';
 export { useLocationMiddleware, useRouteSetMiddleware, RouteSet, NextRoute } from './route-set';
 export { usePreRenderMiddleware, usePostRenderMiddleware, RenderInstruction } from './component-renderer';
 export { Routes, Route, IndexRoute } from './route';
 export { useTraversalMiddleware, TraversalCandidate } from './match-route';
-export { QueryParams } from './query-params';
 export { LinkTo } from './link-to';
 export { LinkActive } from './link-active';

lib/location.ts

@@ -120,6 +120,16 @@ export class Location extends ReplaySubject<LocationChange> {
     this._update('replace');
   }
 
+  /**
+   * Changes the browsers query parameters. Replaces teh top item on the platform's
+   * history stack
+   */
+   search(query: any = ''): void {
+     const [ pathname ] = this.path().split('?');
+
+     this.replaceState(pathname, query);
+   }
+
   /**
    * Navigates forward in the platform's history.
    */

lib/params.ts

@@ -0,0 +1,27 @@
+import 'rxjs/add/operator/map';
+import { Observable } from 'rxjs/Observable';
+import { Provider } from 'angular2/core';
+
+import { RouteSet } from './route-set';
+
+export abstract class RouteParams extends Observable<{ [param: string]: any }> { }
+export abstract class QueryParams extends Observable<{ [param: string]: any }> { }
+
+function createRouteParams(set$: RouteSet): RouteParams {
+  return set$.map(next => next.params);
+}
+
+function createQueryParams(set$: RouteSet): QueryParams {
+  return set$.map(next => next.query);
+}
+
+export const PARAMS_PROVIDERS = [
+  new Provider(RouteParams, {
+    deps: [ RouteSet ],
+    useFactory: createRouteParams
+  }),
+  new Provider(QueryParams, {
+    deps: [ RouteSet ],
+    useFactory: createQueryParams
+  })
+];

spec/location.spec.ts

@@ -22,7 +22,7 @@ import {MockLocationStrategy} from 'angular2/src/mock/mock_location_strategy';
 
 describe('Location', () => {
 
-  var locationStrategy, location;
+  let locationStrategy, location;
 
   function makeLocation(baseHref: string = '/my/app', provider: any = CONST_EXPR([])): Location {
     locationStrategy = new MockLocationStrategy();
@@ -58,8 +58,8 @@ describe('Location', () => {
    });
 
   it('should revert to the previous path when a back() operation is executed', () => {
-    var locationStrategy = new MockLocationStrategy();
-    var location = new Location(locationStrategy);
+    let locationStrategy = new MockLocationStrategy();
+    let location = new Location(locationStrategy);
 
     function assertUrl(path) { expect(location.path()).toEqual(path); }
 
@@ -80,11 +80,40 @@ describe('Location', () => {
   });
 
   it('should incorporate the provided query values into the location change', () => {
-    var locationStrategy = new MockLocationStrategy();
-    var location = new Location(locationStrategy);
+    let locationStrategy = new MockLocationStrategy();
+    let location = new Location(locationStrategy);
 
-    location.go('/home', "key=value");
-    expect(location.path()).toEqual("/home?key=value");
+    location.go('/home', 'key=value');
+    expect(location.path()).toEqual('/home?key=value');
+
+    location.go('/home', { foo: 'bar' });
+    expect(location.path()).toEqual('/home?foo=bar');
+  });
+
+  it('should allow you to replace query params', () => {
+    let locationStrategy = new MockLocationStrategy();
+    let location = new Location(locationStrategy);
+
+    location.go('/home');
+    location.search('key=value');
+    expect(location.path()).toEqual('/home?key=value');
+
+    location.search({ foo: 'bar' });
+    expect(location.path()).toEqual('/home?foo=bar');
+  });
+
+  it('should replace the state when using search to update query params', () => {
+    let locationStrategy = new MockLocationStrategy();
+    let location = new Location(locationStrategy);
+
+    location.go('/home');
+
+    spyOn(location, 'replaceState');
+    spyOn(location, 'go');
+
+    location.search('key=value');
+    expect(location.go).not.toHaveBeenCalled();
+    expect(location.replaceState).toHaveBeenCalledWith('/home', 'key=value');
   });
 
   it('should update subject on location update', (done) => {

spec/params.spec.ts

@@ -0,0 +1,54 @@
+import { Subject } from 'rxjs/Subject';
+import { Injector, provide } from 'angular2/core';
+import { NextRoute, RouteSet } from '../lib/route-set';
+import { RouteParams, QueryParams, PARAMS_PROVIDERS } from '../lib/params';
+
+
+describe('Params Services', function() {
+  let routeSet$: Subject<NextRoute>;
+  let routeParams$: RouteParams;
+  let queryParams$: QueryParams;
+
+  beforeEach(function() {
+    routeSet$ = new Subject<NextRoute>();
+    const injector = Injector.resolveAndCreate([
+      PARAMS_PROVIDERS,
+      provide(RouteSet, { useValue: routeSet$ })
+    ]);
+
+    routeParams$ = injector.get(RouteParams);
+    queryParams$ = injector.get(QueryParams);
+  });
+
+  afterEach(function() {
+    routeSet$.complete();
+  });
+
+  describe('RouteParams', function() {
+    it('should project route params from the current route set', function(done) {
+      const params = { id: 123 };
+
+      routeParams$.subscribe(value => {
+        expect(value).toBe(params);
+
+        done();
+      });
+
+      routeSet$.next({ routes: [], params, url: '', query: {} });
+    });
+  });
+
+  describe('QueryParams', function() {
+    it('should project query params from the current route set', function(done) {
+      const query = { search: 'abcd' };
+
+      queryParams$.subscribe(value => {
+        expect(value).toBe(query);
+
+        done();
+      });
+
+      routeSet$.next({ routes: [], params: {}, url: '', query });
+    });
+  });
+});