1<!-- 2@license 3Copyright (c) 2016 The Polymer Project Authors. All rights reserved. 4This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt 5The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt 6The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt 7Code distributed by Google as part of the polymer project is also 8subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt 9--> 10 11<link rel="import" href="../polymer/polymer.html"> 12<link rel="import" href="./app-route-converter-behavior.html"> 13 14<!-- 15`app-route-converter` provides a means to convert a path and query 16parameters into a route object and vice versa. This produced route object 17is to be fed into route-consuming elements such as `app-route`. 18 19> n.b. This element is intended to be a primitive of the routing system and for 20creating bespoke routing solutions from scratch. To simply include routing in 21an app, please refer to [app-location](https://github.com/PolymerElements/app-route/blob/master/app-location.html) 22and [app-route](https://github.com/PolymerElements/app-route/blob/master/app-route.html). 23 24An example of a route object that describes 25`https://elements.polymer-project.org/elements/app-route-converter?foo=bar&baz=qux` 26and should be passed to other `app-route` elements: 27 28 { 29 prefix: '', 30 path: '/elements/app-route-converter', 31 __queryParams: { 32 foo: 'bar', 33 baz: 'qux' 34 } 35 } 36 37`__queryParams` is private to discourage directly data-binding to it. This is so 38that routing elements like `app-route` can intermediate changes to the query 39params and choose whether to propagate them upstream or not. `app-route` for 40example will not propagate changes to its `queryParams` property if it is not 41currently active. A public queryParams object will also be produced in which you 42should perform data-binding operations. 43 44Example Usage: 45 46 <iron-location path="{{path}}" query="{{query}}"></iron-location> 47 <iron-query-params 48 params-string="{{query}}" 49 params-object="{{queryParams}}"> 50 </iron-query-params> 51 <app-route-converter 52 path="{{path}}" 53 query-params="{{queryParams}}" 54 route="{{route}}"> 55 </app-route-converter> 56 <app-route route='{{route}}' pattern='/:page' data='{{data}}'> 57 </app-route> 58 59This is a simplified implementation of the `app-location` element. Here the 60`iron-location` produces a path and a query, the `iron-query-params` consumes 61the query and produces a queryParams object, and the `app-route-converter` 62consumes the path and the query params and converts it into a route which is in 63turn is consumed by the `app-route`. 64 65@element app-route-converter 66@demo demo/index.html 67--> 68 69<script> 70 (function() { 71 'use strict'; 72 73 Polymer({ 74 is: 'app-route-converter', 75 76 behaviors: [Polymer.AppRouteConverterBehavior] 77 }); 78 })(); 79</script> 80