polymer

How to two-way bind iron-input to dom-repeat's item?

走远了吗. 提交于 2019-12-04 05:35:23
I just started playing with Polymer 1.0 and am trying to do a very simple binding to collection. I am able to display text within dom-repeat, but the two-way binding to iron-input does not work. I tried array of strings, and objects. No luck. <link rel="import" href="bower_components/polymer/polymer.html"> <link rel="import" href="bower_components/iron-input/iron-input.html"> <dom-module id="hello-world"> <template> <ul> <template is="dom-repeat" items="{{data}}"> <li>{{item.value}}</li> </template> </ul> <ul> <template is="dom-repeat" items="{{data}}"> <li><input is="iron-input" bind-value="{

Add a “dynamic” element with data-binding to my polymer-element

微笑、不失礼 提交于 2019-12-04 05:27:22
问题 For days I try to feed Polymer with some "dynamic" elements :) Unfortunately without success... My goal is to get an element added during runtime and fill it with content by polymer-data-binding (in a "natural" polymer-way. Without a workaround as suggested in another stackoverflow answer.) Please take a look at the code in this fiddle (https://jsfiddle.net/mkappeller/ken9Lzc7/) or at the bottom of this question. I really hope anyone out there is able to help me out. It would also help to

flatiron-director / core-pages SPA with route specific js functions & default route

对着背影说爱祢 提交于 2019-12-04 05:15:57
问题 i am working with flatiron-director and core-pages. my question is how would i set a default route? also how do i call js functions on specific routes. my code looks something like this <template is="auto-binding"> <flatiron-director id='page-director' route="{{route}}" autoHash on-director-route="{{routeChanged}}"></flatiron-director> <core-menu id="menu"> <paper-item icon="list" label="1"> <a href="#1"></a> </paper-item> <paper-item icon="swap-vert" label="2"> <a href="#2"></a> </paper-item

Autosizing canvas inside a polymer grid layout

断了今生、忘了曾经 提交于 2019-12-04 04:08:39
问题 I have a component that's laid out using polymer-grid-layout which contains a canvas as the main part of the content. I want the canvas to auto resize based on the size that polymer-grid-layout allocates. I can't put width:100%; height:100% on the canvas as that just stretches the canvas making it distorted and grainy. Instead I wrapped a div around the canvas and manually resize the canvas based on the div size in code. Code looks somewhat like (note I've left out the boiler plate like etc)

Polymer: How to loop and render HTML to screen

江枫思渺然 提交于 2019-12-04 03:46:21
I am working on a widget that pulls third party information from a database using json. Once the information has been collected, I plan to loop through the information and create the required HTML code and insert this into the template via a {{variable}} Now I am getting an unexpected result. When I do this, the html is being displayed as text. Here is some sudo code of the issue: <polymer-element name="loop-element"> <template> {{customerList}} </template> <script> Polymer('loop-element', { ready: function() { this.loadCustomerList(); } customerList:"Loading customer list...",

Polymer core scaffold coloring and paper button

旧巷老猫 提交于 2019-12-04 03:24:01
I'm starting to use the polymer 0.5 code to build a responsive website. I know it's not fully finished, but nevertheless I find it pretty neat and simple to get stuff done quickly. Now, I'm using the core-scaffold as general layout. I know how to color the sidebar, but I'm not sure where I can style the main content settings. <html> <head> <style> html,body { height: 100%; margin: 0; background-color: #E5E5E5; font-family: 'RobotoDraft', sans-serif; } core-toolbar { background: #E5E5E5; color: white; } paper-item.core-selected { color: #99182c; fill: #99182c; } </style> </head> <body

clone of polymer element remove template of polymer element

夙愿已清 提交于 2019-12-04 02:58:27
my polymer element: <ele-label id="newLabel" color="#000000" bgColor="#f1f1f1" eleHeight="30" eleWidth="50" text="Name:" eleDisplay="inline-block" elefloat="left"></ele-label> but when I clone this element inner html will removed. can any one help me ? <polymer-element name="ele-label" attributes="text color eleid eleWidth eleHeight fontSize bgColor paddingTop paddingBottom paddingLeft paddingRight eleDisplay elefloat" > <template> <div><label style="font-size:{{fontSize}}pt; color:{{color}} ;">{{text}}</label></div> </template></polymer-element> finally got solution polylabel1 : id of my div

Passing a function as an attribute value

霸气de小男生 提交于 2019-12-04 02:58:18
I was wondering if it was possible to pass a function foo() as an attribute func="foo()" and have it called this.func() inside of the polymer element? <foo-bar func="foo()"></foo-bar> Polymer({ is: 'foo-bar', properties: { func: Object, }, ready: function() { this.func(); } }); I've been trying to get this working for ages with no luck. Thanks in advance. CoolestUsername <foo-bar func="foo()"></foo-bar> Polymer({ is: 'foo-bar', properties: { func: { type: String, // the function call is passed in as a string notify: true }, attached: function() { if (this.func) { this.callFunc = new Function(

Polymer.prototype.splice don't behave as expected

浪尽此生 提交于 2019-12-04 01:50:35
问题 I'm doing array mutation with Polymer's array mutation methods. this.allRules = [{name: "abc", enabled: true}]; var item = this.allRules[index]; item.name = "abcdxfdsa"; item.enabled = enabled; // console log out [Object] console.log(this.allRules); this.splice('allRules', index, 1); // Instead of logging out [], it logs out [splices: Object] console.log(this.allRules); this.push('allRules', item); // It logs out [Object, splices: Object] console.log(poly.allRules); And the annoying thing is

Private non-static variables in polymer?

自古美人都是妖i 提交于 2019-12-04 01:26:48
How is it possible to have private non-static variables in polymer? In: <polymer-element name="component-one"> <script> Polymer('component-one', { internalState = 1, ready() { this.anotherInternalState = 1; } /* more variables and functions */ }); </script> </polymer-element> both internalState and anotherInernalState are exposed to outside (e.g. accessible through something like: document.querySelector('component-one').internalState (Which might be undesirable when changing internalState from outside makes the component unstable.) where as in: <polymer-element name="component-two"> <script>