polymer

Polymer - how to create element with binding

由 别等时光非礼了梦想. 提交于 2019-12-24 02:33:34
问题 I need to create polymer custom element with binding attribute. <foo-bar baz="{{qux}}"></foo-bar> It's OK. But it must be created dynamically (tagName passed as an attribute). I try this Polymer({ ready: function() { var element = document.createElement(this.tagName); element.setAttribute('baz', '{{qux}}'); this.$.placeholder.appendChild(element); } }); But it does not work. How can I do that? 回答1: You can do this with injectBoundHTML() : <div id="container"></div> ... this.injectBoundHTML('

Polymer 1.0 - Responsive columns

由 半世苍凉 提交于 2019-12-24 02:13:50
问题 Here is what I want to achieve with Polymer Elements: Polymer Structure The column size is not always the same width but relative to the screen or warpper-div size. In example 1, it's each 16.66%, in example 2 it is 33.33%, in example 3 it should be 100%. I need a responsive layout where -dependent upon the screen size- a different number of columns is displayed per row and each of their column sizes will be adjusted. Does anyone know how I can achieve this with https://elements.polymer

Polymer 1.x: paper-dialog modal appears behind app-header-layout

由 纵饮孤独 提交于 2019-12-24 02:07:19
问题 I want to put a sub-element (child) inside an app-header-layout . The sub-element contains a paper-dialog modal . When I open the modal I expect to see the dialog box appear in front of the backdrop. Instead, the dialog appears behind the backdrop. How do I get the modal dialog to appear in front of the backdrop? Or is this perhaps a newly discovered bug in the app-drawer-layout or app-header-layout elements? Here is the plunk. ... http://plnkr.co/edit/ZjPHGqkt8vvDbFdF4CNn?p=preview index

Polymer - dynamic template rendering

由 梦想与她 提交于 2019-12-24 02:07:01
问题 is it somehow possible to render the template in a polymer element dynamically at runtime or when some light-dom elements are available? I have the following situation: index.html <mega-menu> <span class="menuTriggerText">Open Menu</span> <ul class="test"> <li>TEST1</li> <li>TEST2</li> </ul> <ul class="test"> <li>TEST1</li> <li>TEST2</li> </ul> </mega-menu> in my polymer-element.html i want to do something as follows: <template> <template repeat="{{temp}}"><p>I want to try this</template> <

Polymer: How to add event listeners to custom polymer element under conditional template

由 夙愿已清 提交于 2019-12-24 00:58:25
问题 I have a custom element <y-list> which fires an event 'item-selected' i am using this element in another custom element and when i try to add eventlistener to this element <dom-module id="my-list"> <template is="dom-if" if="{{show}}"> <y-list list="{{list}}"> </y-list> <hr> </template> </dom-module> Polymer({ is: 'my-list', properties: { show: { type:Boolean, value:function() { return false } }, list: { type:Array, value:[] } }, ready: function(){ }, attached: function(){ this.querySelector(

creating a google map with marker using web-component

由 让人想犯罪 __ 提交于 2019-12-24 00:53:25
问题 I'm trying to use polymer and web-component to display some markers in the google-map. Here's my code : <!DOCTYPE html> <html> <head lang="fr"> <meta charset="UTF-8"> <title></title> <script src="bower_components/platform/platform.js"></script> <link rel="import" href="bower_components/polymer/polymer.html"> <link rel="import" href="bower_components/google-apis/google-apis.html"> <link rel="import" href="bower_components/google-map/google-map.html"> <script> var airdromes = [ { "name" :

Polymer 1.x: How to reset entire app after logout

由 天大地大妈咪最大 提交于 2019-12-23 23:18:24
问题 I have a Polymer app. When a user logs out, I want to reset the entire app to its original state. (Right now, when the user logs back in after logging out, the app returns the user to the app state and page they were on when they logged out.) Is there any convenient (i.e., global) app design or code pattern for accomplishing this? If there is nothing convenient/global, please show how to accomplish this locally (i.e., on an element-by-element basis). Edit After some research (and

Hosting Polymer app on web server with base URLs

由 倾然丶 夕夏残阳落幕 提交于 2019-12-23 19:15:30
问题 If I take the Polymer starter kit, it works well locally. I can navigate to http://localhost:8080/ and all the links to the 3 views work fine. Now, if I host this app on a web server (that is shared with other apps) on a URL such as http://myservername:8080/mywonderfulapp/, I am having trouble with the routing. Is there a way I can mention the app-route to take in the relative URL? I tried making changes to the html files to have relative URLs <link rel="import" href="./src/my-app.html"> <a

2 way data-binding between a polymer component and a model?

由 寵の児 提交于 2019-12-23 18:01:06
问题 Before using Polymer, I would like to check that it's possible to do a 2 way data-binding between a component and a javascript model. I read the data-binding section on the website but this point is still not clear to me. A simple example: if I have a "audio" model with a "volume" property in javascript, can I bind this volume property to a slider for example? I'm more familiar with JavaFx and here is typically the JavaFx code that would do the trick: slider.valueProperty().bindBidirectional

Autocomplete / Autofill with Polymer input elements (gold-email-input)

由 雨燕双飞 提交于 2019-12-23 17:52:12
问题 I'm having an issue getting Chrome's autofill and/or autocomplete working with Polymer input elements, such as gold-email-input. I've tried setting the autocomplete attribute of the gold-email-input component to on and I've also tried setting it to email . The autofill box appears, but selecting an entry from the autofill selections does not populate the control. What am I doing wrong? 回答1: <form is="iron-form"> <gold-email-input></gold-email-input> </form> This tends to work 回答2: You don't
订阅 polymer