Home Start Get started Build an element 1. Get set up 2. Add local DOM 3. Data binding & properties 4. React to input 5. Theming with custom properties Build an app 1. Get set up 2. Create a new page 3. Add some elements 4. Deploy Polymer Feature overview Quick tour Define elements Register an element Declare properties Instance methods Behaviors Local DOM & styling Local DOM Styling Events Handle and fire events Gesture events Data system Data system concepts Work with object and array data Observers and computed properties Data binding Helper elements Tools Tools overview Polymer CLI Document your elements Test your elements Optimize for production Publish an element Advanced tools Services What's new Release notes 1.0 Migration guide About Polymer 1.0 Resources Community Browser compatibility API Reference Polymer.Base array-selector custom-style dom-bind dom-if dom-repeat dom-template Polymer.Templatizer Global settings App Toolbox What's in the box? Using the Toolbox App templates Responsive app layout Routing Localization App storage Service worker Serve your app Case study Shop News Blog Community Feature overview Quick tour
Define elements
Register an element Declare properties Instance methods Behaviors
Local DOM & styling
Local DOM Styling
Events
Handle and fire events Gesture events
Data system
Data system concepts Work with object and array data Observers and computed properties Data binding Helper elements
Tools
Tools overview Polymer CLI Document your elements Test your elements Optimize for production Publish an element Advanced tools Services
What's new
Release notes 1.0 Migration guide About Polymer 1.0
Resources
Community Browser compatibility
API Reference
Polymer.Base array-selector custom-style dom-bind dom-if dom-repeat dom-template Polymer.Templatizer Global settings
{"type":"element","desc":"\n\nThe `dom-repeat` element is a custom `HTMLTemplateElement` type extension that\nautomatically stamps and binds one instance of template content to each object\nin a user-provided array. `dom-repeat` accepts an `items` property, and one\ninstance of the template is stamped for each item into the DOM at the location\nof the `dom-repeat` element. The `item` property will be set on each instance's\nbinding scope, thus templates should bind to sub-properties of `item`.\n\nExample:\n\n```html\n<dom-module id=\"employee-list\">\n\n <template>\n\n <div> Employee list: </div>\n <template is=\"dom-repeat\" items=\"{{employees}}\">\n <div>First name: <span>{{item.first}}</span></div>\n <div>Last name: <span>{{item.last}}</span></div>\n </template>\n\n </template>\n\n <script>\n Polymer({\n is: 'employee-list',\n ready: function() {\n this.employees = [\n {first: 'Bob', last: 'Smith'},\n {first: 'Sally', last: 'Johnson'},\n ...\n ];\n }\n });\n </script>\n\n</dom-module>\n```\n\nNotifications for changes to items sub-properties will be forwarded to template\ninstances, which will update via the normal structured data notification system.\n\nMutations to the `items` array itself should me made using the Array\nmutation API's on `Polymer.Base` (`push`, `pop`, `splice`, `shift`,\n`unshift`), and template instances will be kept in sync with the data in the\narray.\n\nEvents caught by event handlers within the `dom-repeat` template will be\ndecorated with a `model` property, which represents the binding scope for\neach template instance. The model is an instance of Polymer.Base, and should\nbe used to manipulate data on the instance, for example\n`event.model.set('item.checked', true);`.\n\nAlternatively, the model for a template instance for an element stamped by\na `dom-repeat` can be obtained using the `modelForElement` API on the\n`dom-repeat` that stamped it, for example\n`this.$.domRepeat.modelForElement(event.target).set('item.checked', true);`.\nThis may be useful for manipulating instance data of event targets obtained\nby event handlers on parents of the `dom-repeat` (event delegation).\n\nA view-specific filter/sort may be applied to each `dom-repeat` by supplying a\n`filter` and/or `sort` property. This may be a string that names a function on\nthe host, or a function may be assigned to the property directly. The functions\nshould implemented following the standard `Array` filter/sort API.\n\nIn order to re-run the filter or sort functions based on changes to sub-fields\nof `items`, the `observe` property may be set as a space-separated list of\n`item` sub-fields that should cause a re-filter/sort when modified. If\nthe filter or sort function depends on properties not contained in `items`,\nthe user should observe changes to those properties and call `render` to update\nthe view based on the dependency change.\n\nFor example, for an `dom-repeat` with a filter of the following:\n\n```js\nisEngineer: function(item) {\n return item.type == 'engineer' || item.manager.type == 'engineer';\n}\n```\n\nThen the `observe` property should be configured as follows:\n\n```html\n<template is=\"dom-repeat\" items=\"{{employees}}\"\n filter=\"isEngineer\" observe=\"type manager.type\">\n```\n\n","events":[{"desc":"\nFired whenever DOM is added or removed by this template (by\ndefault, rendering occurs lazily). To force immediate rendering, call\n`render`.\n\n","jsdoc":{"description":"\nFired whenever DOM is added or removed by this template (by\ndefault, rendering occurs lazily). To force immediate rendering, call\n`render`.\n\n","tags":[{"tag":"event","type":null,"description":"dom-change"}],"orig":"*\n * Fired whenever DOM is added or removed by this template (by\n * default, rendering occurs lazily). To force immediate rendering, call\n * `render`.\n *\n * @event dom-change\n "},"name":"dom-change","params":[]}],"properties":[{"name":"as","type":"String","desc":"\nThe name of the variable to add to the binding scope for the array\nelement associated with a given template instance.\n ","published":true,"default":"item","jsdoc":{"description":"\nThe name of the variable to add to the binding scope for the array\nelement associated with a given template instance.\n ","tags":[],"orig":"*\n * The name of the variable to add to the binding scope for the array\n * element associated with a given template instance.\n "}},{"name":"delay","type":"number","desc":"\nWhen using a `filter` or `sort` function, the `delay` property\ndetermines a debounce time after a change to observed item\nproperties that must pass before the filter or sort is re-run.\nThis is useful in rate-limiting shuffing of the view when\nitem changes may be frequent.\n ","published":true,"jsdoc":{"description":"\nWhen using a `filter` or `sort` function, the `delay` property\ndetermines a debounce time after a change to observed item\nproperties that must pass before the filter or sort is re-run.\nThis is useful in rate-limiting shuffing of the view when\nitem changes may be frequent.\n ","tags":[],"orig":"*\n * When using a `filter` or `sort` function, the `delay` property\n * determines a debounce time after a change to observed item\n * properties that must pass before the filter or sort is re-run.\n * This is useful in rate-limiting shuffing of the view when\n * item changes may be frequent.\n "}},{"name":"filter","type":"Function","desc":"\nA function that can be used to filter items out of the view. This\nproperty should either be provided as a string, indicating a method\nname on the element's host, or else be an actual function. The\nfunction should match the sort function passed to `Array.filter`.\nUsing a filter function has no effect on the underlying `items` array.\n ","published":true,"observer":"_filterChanged","observerNode":{"type":"Literal","start":1997,"end":2013,"loc":{"start":{"line":67,"column":18},"end":{"line":67,"column":34}},"range":[1997,2013],"value":"_filterChanged","raw":"'_filterChanged'"},"jsdoc":{"description":"\nA function that can be used to filter items out of the view. This\nproperty should either be provided as a string, indicating a method\nname on the element's host, or else be an actual function. The\nfunction should match the sort function passed to `Array.filter`.\nUsing a filter function has no effect on the underlying `items` array.\n ","tags":[],"orig":"*\n * A function that can be used to filter items out of the view. This\n * property should either be provided as a string, indicating a method\n * name on the element's host, or else be an actual function. The\n * function should match the sort function passed to `Array.filter`.\n * Using a filter function has no effect on the underlying `items` array.\n "},"function":true},{"name":"indexAs","type":"String","desc":"\nThe name of the variable to add to the binding scope with the index\nfor the inst. If `sort` is provided, the index will reflect the\nsorted order (rather than the original array order).\n ","published":true,"default":"index","jsdoc":{"description":"\nThe name of the variable to add to the binding scope with the index\nfor the inst. If `sort` is provided, the index will reflect the\nsorted order (rather than the original array order).\n ","tags":[],"orig":"*\n * The name of the variable to add to the binding scope with the index\n * for the inst. If `sort` is provided, the index will reflect the\n * sorted order (rather than the original array order).\n "}},{"name":"indexForElement","type":"Function","desc":"\nReturns the inst index for a given element stamped by this `dom-repeat`.\nIf `sort` is provided, the index will reflect the sorted order (rather\nthan the original array order).\n\n","params":[{"name":"el","type":"HTMLElement","desc":"Element for which to return the index."}],"jsdoc":{"description":"\nReturns the inst index for a given element stamped by this `dom-repeat`.\nIf `sort` is provided, the index will reflect the sorted order (rather\nthan the original array order).\n\n","tags":[{"tag":"method","type":null,"name":"indexForElement","description":null},{"tag":"param","type":"HTMLElement","name":"el","description":"Element for which to return the index."},{"tag":"return","type":"any","description":"Row index associated with the element (note this may\n not correspond to the array index if a user `sort` is applied)."}],"orig":"*\n * Returns the inst index for a given element stamped by this `dom-repeat`.\n * If `sort` is provided, the index will reflect the sorted order (rather\n * than the original array order).\n *\n * @method indexForElement\n * @param {HTMLElement} el Element for which to return the index.\n * @return {any} Row index associated with the element (note this may\n * not correspond to the array index if a user `sort` is applied).\n "},"function":true,"return":{"type":"any","desc":"Row index associated with the element (note this may\n not correspond to the array index if a user `sort` is applied)."}},{"name":"initialCount","type":"Number","desc":"\nDefines an initial count of template instances to render after setting\nthe `items` array, before the next paint, and puts the `dom-repeat`\ninto \"chunking mode\". The remaining items will be created and rendered\nincrementally at each animation frame therof until all instances have\nbeen rendered.\n ","published":true,"observer":"_initializeChunking","observerNode":{"type":"Literal","start":3588,"end":3609,"loc":{"start":{"line":112,"column":18},"end":{"line":112,"column":39}},"range":[3588,3609],"value":"_initializeChunking","raw":"'_initializeChunking'"},"jsdoc":{"description":"\nDefines an initial count of template instances to render after setting\nthe `items` array, before the next paint, and puts the `dom-repeat`\ninto \"chunking mode\". The remaining items will be created and rendered\nincrementally at each animation frame therof until all instances have\nbeen rendered.\n ","tags":[],"orig":"*\n * Defines an initial count of template instances to render after setting\n * the `items` array, before the next paint, and puts the `dom-repeat`\n * into \"chunking mode\". The remaining items will be created and rendered\n * incrementally at each animation frame therof until all instances have\n * been rendered.\n "}},{"name":"itemForElement","type":"Function","desc":"\nReturns the item associated with a given element stamped by\nthis `dom-repeat`.\n\nNote, to modify sub-properties of the item,\n`modelForElement(el).set('item.<sub-prop>', value)`\nshould be used.\n\n","params":[{"name":"el","type":"HTMLElement","desc":"Element for which to return the item."}],"jsdoc":{"description":"\nReturns the item associated with a given element stamped by\nthis `dom-repeat`.\n\nNote, to modify sub-properties of the item,\n`modelForElement(el).set('item.<sub-prop>', value)`\nshould be used.\n\n","tags":[{"tag":"method","type":null,"name":"itemForElement","description":null},{"tag":"param","type":"HTMLElement","name":"el","description":"Element for which to return the item."},{"tag":"return","type":"any","description":"Item associated with the element."}],"orig":"*\n * Returns the item associated with a given element stamped by\n * this `dom-repeat`.\n *\n * Note, to modify sub-properties of the item,\n * `modelForElement(el).set('item.<sub-prop>', value)`\n * should be used.\n *\n * @method itemForElement\n * @param {HTMLElement} el Element for which to return the item.\n * @return {any} Item associated with the element.\n "},"function":true,"return":{"type":"any","desc":"Item associated with the element."}},{"name":"items","type":"Array","desc":"\nAn array containing items determining how many instances of the template\nto stamp and that that each template instance should bind to.\n ","published":true,"jsdoc":{"description":"\nAn array containing items determining how many instances of the template\nto stamp and that that each template instance should bind to.\n ","tags":[],"orig":"*\n * An array containing items determining how many instances of the template\n * to stamp and that that each template instance should bind to.\n "}},{"name":"keyForElement","type":"Function","desc":"\nReturns the `Polymer.Collection` key associated with a given\nelement stamped by this `dom-repeat`.\n\n","params":[{"name":"el","type":"HTMLElement","desc":"Element for which to return the key."}],"jsdoc":{"description":"\nReturns the `Polymer.Collection` key associated with a given\nelement stamped by this `dom-repeat`.\n\n","tags":[{"tag":"method","type":null,"name":"keyForElement","description":null},{"tag":"param","type":"HTMLElement","name":"el","description":"Element for which to return the key."},{"tag":"return","type":"any","description":"Key associated with the element."}],"orig":"*\n * Returns the `Polymer.Collection` key associated with a given\n * element stamped by this `dom-repeat`.\n *\n * @method keyForElement\n * @param {HTMLElement} el Element for which to return the key.\n * @return {any} Key associated with the element.\n "},"function":true,"return":{"type":"any","desc":"Key associated with the element."}},{"__fromBehavior":"Polymer.Templatizer","name":"modelForElement","type":"Function","desc":"\nReturns the template \"model\" associated with a given element, which\nserves as the binding scope for the template instance the element is\ncontained in. A template model is an instance of `Polymer.Base`, and\nshould be used to manipulate data associated with this template instance.\n\nExample:\n\n var model = modelForElement(el);\n if (model.index < 10) {\n model.set('item.checked', true);\n }\n\n","params":[{"name":"el","type":"HTMLElement","desc":"Element for which to return a template model."}],"jsdoc":{"description":"\nReturns the template \"model\" associated with a given element, which\nserves as the binding scope for the template instance the element is\ncontained in. A template model is an instance of `Polymer.Base`, and\nshould be used to manipulate data associated with this template instance.\n\nExample:\n\n var model = modelForElement(el);\n if (model.index < 10) {\n model.set('item.checked', true);\n }\n\n","tags":[{"tag":"method","type":null,"name":"modelForElement","description":null},{"tag":"param","type":"HTMLElement","name":"el","description":"Element for which to return a template model."},{"tag":"return","type":"Object.<Polymer.Base>","description":"Model representing the binding scope for\n the element."}],"orig":"*\n * Returns the template \"model\" associated with a given element, which\n * serves as the binding scope for the template instance the element is\n * contained in. A template model is an instance of `Polymer.Base`, and\n * should be used to manipulate data associated with this template instance.\n *\n * Example:\n *\n * var model = modelForElement(el);\n * if (model.index < 10) {\n * model.set('item.checked', true);\n * }\n *\n * @method modelForElement\n * @param {HTMLElement} el Element for which to return a template model.\n * @return {Object<Polymer.Base>} Model representing the binding scope for\n * the element.\n "},"function":true,"return":{"type":"Object.<Polymer.Base>","desc":"Model representing the binding scope for\n the element."}},{"name":"observe","type":"String","desc":"\nWhen using a `filter` or `sort` function, the `observe` property\nshould be set to a space-separated list of the names of item\nsub-fields that should trigger a re-sort or re-filter when changed.\nThese should generally be fields of `item` that the sort or filter\nfunction depends on.\n ","published":true,"observer":"_observeChanged","observerNode":{"type":"Literal","start":2428,"end":2445,"loc":{"start":{"line":79,"column":18},"end":{"line":79,"column":35}},"range":[2428,2445],"value":"_observeChanged","raw":"'_observeChanged'"},"jsdoc":{"description":"\nWhen using a `filter` or `sort` function, the `observe` property\nshould be set to a space-separated list of the names of item\nsub-fields that should trigger a re-sort or re-filter when changed.\nThese should generally be fields of `item` that the sort or filter\nfunction depends on.\n ","tags":[],"orig":"*\n * When using a `filter` or `sort` function, the `observe` property\n * should be set to a space-separated list of the names of item\n * sub-fields that should trigger a re-sort or re-filter when changed.\n * These should generally be fields of `item` that the sort or filter\n * function depends on.\n "}},{"name":"render","type":"Function","desc":"\nForces the element to render its content. Normally rendering is\nasynchronous to a provoking change. This is done for efficiency so\nthat multiple changes trigger only a single render. The render method\nshould be called if, for example, template rendering is required to\nvalidate application state.\n ","params":[],"jsdoc":{"description":"\nForces the element to render its content. Normally rendering is\nasynchronous to a provoking change. This is done for efficiency so\nthat multiple changes trigger only a single render. The render method\nshould be called if, for example, template rendering is required to\nvalidate application state.\n ","tags":[],"orig":"*\n * Forces the element to render its content. Normally rendering is\n * asynchronous to a provoking change. This is done for efficiency so\n * that multiple changes trigger only a single render. The render method\n * should be called if, for example, template rendering is required to\n * validate application state.\n "},"function":true},{"name":"renderedItemCount","type":"Number","desc":"\nCount of currently rendered items after `filter` (if any) has been applied.\nIf \"chunking mode\" is enabled, `renderedItemCount` is updated each time a\nset of template instances is rendered.\n\n ","published":true,"notify":true,"readOnly":true,"jsdoc":{"description":"\nCount of currently rendered items after `filter` (if any) has been applied.\nIf \"chunking mode\" is enabled, `renderedItemCount` is updated each time a\nset of template instances is rendered.\n\n ","tags":[],"orig":"*\n * Count of currently rendered items after `filter` (if any) has been applied.\n * If \"chunking mode\" is enabled, `renderedItemCount` is updated each time a\n * set of template instances is rendered.\n *\n "}},{"name":"sort","type":"Function","desc":"\nA function that should determine the sort order of the items. This\nproperty should either be provided as a string, indicating a method\nname on the element's host, or else be an actual function. The\nfunction should match the sort function passed to `Array.sort`.\nUsing a sort function has no effect on the underlying `items` array.\n ","published":true,"observer":"_sortChanged","observerNode":{"type":"Literal","start":1513,"end":1527,"loc":{"start":{"line":55,"column":18},"end":{"line":55,"column":32}},"range":[1513,1527],"value":"_sortChanged","raw":"'_sortChanged'"},"jsdoc":{"description":"\nA function that should determine the sort order of the items. This\nproperty should either be provided as a string, indicating a method\nname on the element's host, or else be an actual function. The\nfunction should match the sort function passed to `Array.sort`.\nUsing a sort function has no effect on the underlying `items` array.\n ","tags":[],"orig":"*\n * A function that should determine the sort order of the items. This\n * property should either be provided as a string, indicating a method\n * name on the element's host, or else be an actual function. The\n * function should match the sort function passed to `Array.sort`.\n * Using a sort function has no effect on the underlying `items` array.\n "},"function":true},{"__fromBehavior":"Polymer.Templatizer","name":"stamp","type":"Function","desc":"\nCreates an instance of the template previously processed via\na call to `templatize`.\n\nThe object returned is an anonymous subclass of Polymer.Base that\nhas accessors generated to manage data in the template. The DOM for\nthe instance is contained in a DocumentFragment called `root` on\nthe instance returned and must be manually inserted into the DOM\nby the user.\n\nNote that a call to `templatize` must be called once before using\n`stamp`.\n\n","params":[{"name":"model","type":"Object=","desc":"An object containing key/values to serve as the\n initial data configuration for the instance. Note that properties\n from the host used in the template are automatically copied into\n the model."}],"jsdoc":{"description":"\nCreates an instance of the template previously processed via\na call to `templatize`.\n\nThe object returned is an anonymous subclass of Polymer.Base that\nhas accessors generated to manage data in the template. The DOM for\nthe instance is contained in a DocumentFragment called `root` on\nthe instance returned and must be manually inserted into the DOM\nby the user.\n\nNote that a call to `templatize` must be called once before using\n`stamp`.\n\n","tags":[{"tag":"method","type":null,"name":"stamp","description":null},{"tag":"param","type":"Object=","name":"model","description":"An object containing key/values to serve as the\n initial data configuration for the instance. Note that properties\n from the host used in the template are automatically copied into\n the model."},{"tag":"return","type":"Polymer.Base","description":"The Polymer.Base instance to manage the template\n instance."}],"orig":"*\n * Creates an instance of the template previously processed via\n * a call to `templatize`.\n *\n * The object returned is an anonymous subclass of Polymer.Base that\n * has accessors generated to manage data in the template. The DOM for\n * the instance is contained in a DocumentFragment called `root` on\n * the instance returned and must be manually inserted into the DOM\n * by the user.\n *\n * Note that a call to `templatize` must be called once before using\n * `stamp`.\n *\n * @method stamp\n * @param {Object=} model An object containing key/values to serve as the\n * initial data configuration for the instance. Note that properties\n * from the host used in the template are automatically copied into\n * the model.\n * @return {Polymer.Base} The Polymer.Base instance to manage the template\n * instance.\n "},"function":true,"return":{"type":"Polymer.Base","desc":"The Polymer.Base instance to manage the template\n instance."}},{"name":"targetFramerate","type":"Number","desc":"\nWhen `initialCount` is used, this property defines a frame rate to\ntarget by throttling the number of instances rendered each frame to\nnot exceed the budget for the target frame rate. Setting this to a\nhigher number will allow lower latency and higher throughput for\nthings like event handlers, but will result in a longer time for the\nremaining items to complete rendering.\n ","published":true,"default":20,"jsdoc":{"description":"\nWhen `initialCount` is used, this property defines a frame rate to\ntarget by throttling the number of instances rendered each frame to\nnot exceed the budget for the target frame rate. Setting this to a\nhigher number will allow lower latency and higher throughput for\nthings like event handlers, but will result in a longer time for the\nremaining items to complete rendering.\n ","tags":[],"orig":"*\n * When `initialCount` is used, this property defines a frame rate to\n * target by throttling the number of instances rendered each frame to\n * not exceed the budget for the target frame rate. Setting this to a\n * higher number will allow lower latency and higher throughput for\n * things like event handlers, but will result in a longer time for the\n * remaining items to complete rendering.\n "}},{"__fromBehavior":"Polymer.Templatizer","name":"templatize","type":"Function","desc":"\nPrepares a template containing Polymer bindings by generating\na constructor for an anonymous `Polymer.Base` subclass to serve as the\nbinding context for the provided template.\n\nUse `this.stamp` to create instances of the template context containing\na `root` fragment that may be stamped into the DOM.\n\n","params":[{"name":"template","type":"HTMLTemplateElement","desc":"The template to process."}],"jsdoc":{"description":"\nPrepares a template containing Polymer bindings by generating\na constructor for an anonymous `Polymer.Base` subclass to serve as the\nbinding context for the provided template.\n\nUse `this.stamp` to create instances of the template context containing\na `root` fragment that may be stamped into the DOM.\n\n","tags":[{"tag":"method","type":null,"name":"templatize","description":null},{"tag":"param","type":"HTMLTemplateElement","name":"template","description":"The template to process."}],"orig":"*\n * Prepares a template containing Polymer bindings by generating\n * a constructor for an anonymous `Polymer.Base` subclass to serve as the\n * binding context for the provided template.\n *\n * Use `this.stamp` to create instances of the template context containing\n * a `root` fragment that may be stamped into the DOM.\n *\n * @method templatize\n * @param {HTMLTemplateElement} template The template to process.\n "},"function":true},{"__fromBehavior":"Polymer.Templatizer","name":"__hideTemplateChildren__","type":"Object","published":true,"observer":"_showHideChildren","observerNode":{"type":"Literal","start":2172,"end":2191,"loc":{"start":{"line":59,"column":18},"end":{"line":59,"column":37}},"range":[2172,2191],"value":"_showHideChildren","raw":"'_showHideChildren'"},"private":true},{"__fromBehavior":"Polymer.Templatizer","name":"__setPropertyImpl","type":"Function","params":[{"name":"property"},{"name":"value"},{"name":"fromAbove"},{"name":"node"}],"private":true,"function":true},{"name":"_applyFullRefresh","type":"Function","desc":" and iterated to create (or reuse) existing instances","params":[],"jsdoc":{"description":" and iterated to create (or reuse) existing instances","tags":[],"orig":" and iterated to create (or reuse) existing instances"},"private":true,"function":true},{"name":"_applySplicesArrayOrder","type":"Function","desc":" actual rows at the end to take full advantage of removed rows","params":[{"name":"splices"}],"jsdoc":{"description":" actual rows at the end to take full advantage of removed rows","tags":[],"orig":" actual rows at the end to take full advantage of removed rows"},"private":true,"function":true},{"name":"_applySplicesUserSort","type":"Function","desc":" first, and added rows are insertion-sorted into place using user sort","params":[{"name":"splices"}],"jsdoc":{"description":" first, and added rows are insertion-sorted into place using user sort","tags":[],"orig":" first, and added rows are insertion-sorted into place using user sort"},"private":true,"function":true},{"name":"_attachInstance","type":"Function","params":[{"name":"idx"},{"name":"parent"}],"private":true,"function":true},{"name":"_checkObservedPaths","type":"Function","params":[{"name":"path"}],"private":true,"function":true},{"name":"_computeFrameTime","type":"Function","params":[{"name":"rate"}],"private":true,"function":true},{"__fromBehavior":"Polymer.Templatizer","name":"_constructorImpl","type":"Function","params":[{"name":"model"},{"name":"host"}],"private":true,"function":true},{"__fromBehavior":"Polymer.Templatizer","name":"_createForwardPropEffector","type":"Function","params":[{"name":"prop"}],"private":true,"function":true},{"__fromBehavior":"Polymer.Templatizer","name":"_createHostPropEffector","type":"Function","params":[{"name":"prop"}],"private":true,"function":true},{"__fromBehavior":"Polymer.Templatizer","name":"_createInstancePropEffector","type":"Function","params":[{"name":"prop"}],"private":true,"function":true},{"__fromBehavior":"Polymer.Templatizer","name":"_customPrepAnnotations","type":"Function","params":[{"name":"archetype"},{"name":"template"}],"private":true,"function":true},{"__fromBehavior":"Polymer.Templatizer","name":"_customPrepEffects","type":"Function","params":[{"name":"archetype"}],"private":true,"function":true},{"__fromBehavior":"Polymer.Templatizer","name":"_debounceTemplate","type":"Function","params":[{"name":"fn"}],"private":true,"function":true},{"name":"_detachAndRemoveInstance","type":"Function","params":[{"name":"idx"}],"private":true,"function":true},{"name":"_detachInstance","type":"Function","params":[{"name":"idx"}],"private":true,"function":true},{"name":"_downgradeInstance","type":"Function","params":[{"name":"idx"},{"name":"key"}],"private":true,"function":true},{"__fromBehavior":"Polymer.Templatizer","name":"_extendTemplate","type":"Function","desc":" values (_propertySetter back on instance once accessor is installed)","params":[{"name":"template"},{"name":"proto"}],"jsdoc":{"description":" values (_propertySetter back on instance once accessor is installed)","tags":[],"orig":" values (_propertySetter back on instance once accessor is installed)"},"private":true,"function":true},{"name":"_filterChanged","type":"Function","params":[{"name":"filter"}],"private":true,"function":true},{"__fromBehavior":"Polymer.Templatizer","name":"_flushTemplates","type":"Function","params":[],"private":true,"function":true},{"name":"_forwardInstancePath","type":"Function","desc":" for notifying items.<key-for-inst>.<path> change up to host","params":[{"name":"inst"},{"name":"path"},{"name":"value"}],"jsdoc":{"description":" for notifying items.<key-for-inst>.<path> change up to host","tags":[],"orig":" for notifying items.<key-for-inst>.<path> change up to host"},"private":true,"function":true},{"name":"_forwardInstanceProp","type":"Function","desc":" for notifying items.<key-for-inst> change up to host","params":[{"name":"inst"},{"name":"prop"},{"name":"value"}],"jsdoc":{"description":" for notifying items.<key-for-inst> change up to host","tags":[],"orig":" for notifying items.<key-for-inst> change up to host"},"private":true,"function":true},{"name":"_forwardItemPath","type":"Function","desc":" responsible for notifying item.<path> changes to inst for key","params":[{"name":"path"},{"name":"value"}],"jsdoc":{"description":" responsible for notifying item.<path> changes to inst for key","tags":[],"orig":" responsible for notifying item.<path> changes to inst for key"},"private":true,"function":true},{"name":"_forwardParentPath","type":"Function","desc":" notifying parent path change on each inst","params":[{"name":"path"},{"name":"value"}],"jsdoc":{"description":" notifying parent path change on each inst","tags":[],"orig":" notifying parent path change on each inst"},"private":true,"function":true},{"name":"_forwardParentProp","type":"Function","desc":" notifying parent path change on each inst","params":[{"name":"prop"},{"name":"value"}],"jsdoc":{"description":" notifying parent path change on each inst","tags":[],"orig":" notifying parent path change on each inst"},"private":true,"function":true},{"__fromBehavior":"Polymer.Templatizer","name":"_getRootDataHost","type":"Function","params":[],"private":true,"function":true},{"name":"_initializeChunking","type":"Function","params":[],"private":true,"function":true},{"name":"_insertInstance","type":"Function","params":[{"name":"idx"},{"name":"key"}],"private":true,"function":true},{"name":"_insertPlaceholder","type":"Function","params":[{"name":"idx"},{"name":"key"}],"private":true,"function":true},{"name":"_insertRowUserSort","type":"Function","params":[{"name":"start"},{"name":"key"}],"private":true,"function":true},{"__fromBehavior":"Polymer.Templatizer","name":"_instanceProps","type":"Member","desc":" Extension point for overrides","jsdoc":{"description":" Extension point for overrides","tags":[],"orig":" Extension point for overrides"},"private":true},{"name":"_itemsChanged","type":"Function","params":[{"name":"change"}],"private":true,"function":true},{"__fromBehavior":"Polymer.Templatizer","name":"_listenImpl","type":"Function","desc":" Decorate events with model (template instance)","params":[{"name":"node"},{"name":"eventName"},{"name":"methodName"}],"jsdoc":{"description":" Decorate events with model (template instance)","tags":[],"orig":" Decorate events with model (template instance)"},"private":true,"function":true},{"__fromBehavior":"Polymer.Templatizer","name":"_notifyPathUpImpl","type":"Function","desc":" eslint-enable no-unused-vars ","params":[{"name":"path"},{"name":"value"}],"jsdoc":{"description":" eslint-enable no-unused-vars ","tags":[],"orig":" eslint-enable no-unused-vars "},"private":true,"function":true},{"name":"_numericSort","type":"Function","params":[{"name":"a"},{"name":"b"}],"private":true,"function":true},{"name":"_observeChanged","type":"Function","params":[],"private":true,"function":true},{"__fromBehavior":"Polymer.Templatizer","name":"_parentPropPrefix","type":"string","private":true},{"__fromBehavior":"Polymer.Templatizer","name":"_pathEffectorImpl","type":"Function","desc":" Overrides Base notify-path module","params":[{"name":"path"},{"name":"value"},{"name":"fromAbove"}],"jsdoc":{"description":" Overrides Base notify-path module","tags":[],"orig":" Overrides Base notify-path module"},"private":true,"function":true},{"__fromBehavior":"Polymer.Templatizer","name":"_prepParentProperties","type":"Function","desc":" on the archetype and copied to instances.","params":[{"name":"archetype"},{"name":"template"}],"jsdoc":{"description":" on the archetype and copied to instances.","tags":[],"orig":" on the archetype and copied to instances."},"private":true,"function":true},{"name":"_render","type":"Function","params":[],"private":true,"function":true},{"name":"_renderChunk","type":"Function","params":[],"private":true,"function":true},{"name":"_requestRenderChunk","type":"Function","params":[],"private":true,"function":true},{"__fromBehavior":"Polymer.Templatizer","name":"_scopeElementClassImpl","type":"Function","params":[{"name":"node"},{"name":"value"}],"private":true,"function":true},{"name":"_showHideChildren","type":"Function","desc":" Implements extension point from Templatizer mixin","params":[{"name":"hidden"}],"jsdoc":{"description":" Implements extension point from Templatizer mixin","tags":[],"orig":" Implements extension point from Templatizer mixin"},"private":true,"function":true},{"__fromBehavior":"Polymer.Templatizer","name":"_showHideChildrenImpl","type":"Function","params":[{"name":"hide"}],"private":true,"function":true},{"name":"_sortChanged","type":"Function","params":[{"name":"sort"}],"private":true,"function":true},{"name":"_stampInstance","type":"Function","params":[{"name":"idx"},{"name":"key"}],"private":true,"function":true},{"name":"_targetFrameTime","type":"Number","published":true,"private":true},{"name":"_template","type":"object","private":true},{"name":"_tryRenderChunk","type":"Function","params":[],"private":true,"function":true},{"name":"attached","type":"Function","params":[],"private":true,"configuration":true,"function":true},{"name":"created","type":"Function","params":[],"private":true,"configuration":true,"function":true},{"name":"detached","type":"Function","params":[],"private":true,"configuration":true,"function":true},{"name":"extends","type":"string","private":true,"configuration":true},{"name":"ready","type":"Function","params":[],"private":true,"configuration":true,"function":true}],"behaviors":["Polymer.Templatizer"],"observers":[{"javascriptNode":{"type":"Literal","start":4339,"end":4363,"loc":{"start":{"line":140,"column":6},"end":{"line":140,"column":30}},"range":[4339,4363],"value":"_itemsChanged(items.*)","raw":"'_itemsChanged(items.*)'"},"expression":"_itemsChanged(items.*)"}],"is":"dom-repeat","contentHref":"temp/src/lib/template/dom-repeat.html","jsdoc":{"description":"\n\nThe `dom-repeat` element is a custom `HTMLTemplateElement` type extension that\nautomatically stamps and binds one instance of template content to each object\nin a user-provided array. `dom-repeat` accepts an `items` property, and one\ninstance of the template is stamped for each item into the DOM at the location\nof the `dom-repeat` element. The `item` property will be set on each instance's\nbinding scope, thus templates should bind to sub-properties of `item`.\n\nExample:\n\n```html\n<dom-module id=\"employee-list\">\n\n <template>\n\n <div> Employee list: </div>\n <template is=\"dom-repeat\" items=\"{{employees}}\">\n <div>First name: <span>{{item.first}}</span></div>\n <div>Last name: <span>{{item.last}}</span></div>\n </template>\n\n </template>\n\n <script>\n Polymer({\n is: 'employee-list',\n ready: function() {\n this.employees = [\n {first: 'Bob', last: 'Smith'},\n {first: 'Sally', last: 'Johnson'},\n ...\n ];\n }\n });\n </script>\n\n</dom-module>\n```\n\nNotifications for changes to items sub-properties will be forwarded to template\ninstances, which will update via the normal structured data notification system.\n\nMutations to the `items` array itself should me made using the Array\nmutation API's on `Polymer.Base` (`push`, `pop`, `splice`, `shift`,\n`unshift`), and template instances will be kept in sync with the data in the\narray.\n\nEvents caught by event handlers within the `dom-repeat` template will be\ndecorated with a `model` property, which represents the binding scope for\neach template instance. The model is an instance of Polymer.Base, and should\nbe used to manipulate data on the instance, for example\n`event.model.set('item.checked', true);`.\n\nAlternatively, the model for a template instance for an element stamped by\na `dom-repeat` can be obtained using the `modelForElement` API on the\n`dom-repeat` that stamped it, for example\n`this.$.domRepeat.modelForElement(event.target).set('item.checked', true);`.\nThis may be useful for manipulating instance data of event targets obtained\nby event handlers on parents of the `dom-repeat` (event delegation).\n\nA view-specific filter/sort may be applied to each `dom-repeat` by supplying a\n`filter` and/or `sort` property. This may be a string that names a function on\nthe host, or a function may be assigned to the property directly. The functions\nshould implemented following the standard `Array` filter/sort API.\n\nIn order to re-run the filter or sort functions based on changes to sub-fields\nof `items`, the `observe` property may be set as a space-separated list of\n`item` sub-fields that should cause a re-filter/sort when modified. If\nthe filter or sort function depends on properties not contained in `items`,\nthe user should observe changes to those properties and call `render` to update\nthe view based on the dependency change.\n\nFor example, for an `dom-repeat` with a filter of the following:\n\n```js\nisEngineer: function(item) {\n return item.type == 'engineer' || item.manager.type == 'engineer';\n}\n```\n\nThen the `observe` property should be configured as follows:\n\n```html\n<template is=\"dom-repeat\" items=\"{{employees}}\"\n filter=\"isEngineer\" observe=\"type manager.type\">\n```\n\n","tags":[],"orig":"\n\nThe `dom-repeat` element is a custom `HTMLTemplateElement` type extension that\nautomatically stamps and binds one instance of template content to each object\nin a user-provided array. `dom-repeat` accepts an `items` property, and one\ninstance of the template is stamped for each item into the DOM at the location\nof the `dom-repeat` element. The `item` property will be set on each instance's\nbinding scope, thus templates should bind to sub-properties of `item`.\n\nExample:\n\n```html\n<dom-module id=\"employee-list\">\n\n <template>\n\n <div> Employee list: </div>\n <template is=\"dom-repeat\" items=\"{{employees}}\">\n <div>First name: <span>{{item.first}}</span></div>\n <div>Last name: <span>{{item.last}}</span></div>\n </template>\n\n </template>\n\n <script>\n Polymer({\n is: 'employee-list',\n ready: function() {\n this.employees = [\n {first: 'Bob', last: 'Smith'},\n {first: 'Sally', last: 'Johnson'},\n ...\n ];\n }\n });\n </script>\n\n</dom-module>\n```\n\nNotifications for changes to items sub-properties will be forwarded to template\ninstances, which will update via the normal structured data notification system.\n\nMutations to the `items` array itself should me made using the Array\nmutation API's on `Polymer.Base` (`push`, `pop`, `splice`, `shift`,\n`unshift`), and template instances will be kept in sync with the data in the\narray.\n\nEvents caught by event handlers within the `dom-repeat` template will be\ndecorated with a `model` property, which represents the binding scope for\neach template instance. The model is an instance of Polymer.Base, and should\nbe used to manipulate data on the instance, for example\n`event.model.set('item.checked', true);`.\n\nAlternatively, the model for a template instance for an element stamped by\na `dom-repeat` can be obtained using the `modelForElement` API on the\n`dom-repeat` that stamped it, for example\n`this.$.domRepeat.modelForElement(event.target).set('item.checked', true);`.\nThis may be useful for manipulating instance data of event targets obtained\nby event handlers on parents of the `dom-repeat` (event delegation).\n\nA view-specific filter/sort may be applied to each `dom-repeat` by supplying a\n`filter` and/or `sort` property. This may be a string that names a function on\nthe host, or a function may be assigned to the property directly. The functions\nshould implemented following the standard `Array` filter/sort API.\n\nIn order to re-run the filter or sort functions based on changes to sub-fields\nof `items`, the `observe` property may be set as a space-separated list of\n`item` sub-fields that should cause a re-filter/sort when modified. If\nthe filter or sort function depends on properties not contained in `items`,\nthe user should observe changes to those properties and call `render` to update\nthe view based on the dependency change.\n\nFor example, for an `dom-repeat` with a filter of the following:\n\n```js\nisEngineer: function(item) {\n return item.type == 'engineer' || item.manager.type == 'engineer';\n}\n```\n\nThen the `observe` property should be configured as follows:\n\n```html\n<template is=\"dom-repeat\" items=\"{{employees}}\"\n filter=\"isEngineer\" observe=\"type manager.type\">\n```\n\n"},"demos":[]}