polymer

How to use paper-dialog polymer element?

由 与世无争的帅哥 提交于 2019-12-22 04:09:42
问题 I am using the element by adding opening and closing tags <paper-dialog><p>This is it</p></paper-dialog> but it is not getting shown up. Do I need to add some script on top of it so that it should be triggered on some event? Or is there some another way to make it visible ? 回答1: The dialog itself is autohidden. You usually toggle it with a button. For example, give the dialog an id="dialog" and make the button on-tap="toggleDialog" , which would be toggleDialog: () => { this.$.dialog.toggle()

polymer not working or displaying no elements

由 血红的双手。 提交于 2019-12-22 01:31:32
问题 Trying to display hello world using elements but nothing happens any help? index.html <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes"> <script src="bower_components/webcomponentsjs/webcomponents.js"></script> <link rel="import" href="elements/hello-world.html"> </head> <body unresolved> <hello-world></hello-world> </body> </html> hello-world.html <link rel="import" href="../bower_components/polymer

Does Polymers template auto-binding break model property?

由 白昼怎懂夜的黑 提交于 2019-12-22 01:16:52
问题 I'm trying to use <template is="auto-binding"> to use Polymer Expressions inside my template. As for any other <template bind> I activate a template, by attaching model property, as described at Polymer Docs My code looks as follows: <template id="root" is="auto-binding"> List <ul> <template repeat="{{ item in list }}"> <li>{{item.desc}}</li> </template> </ul> </template> <script type="text/javascript"> var template = document.getElementById( "root" ); template.model = { "list": [{ "desc":

What is the best way to implement declarative collection rendering with Polymer?

由 随声附和 提交于 2019-12-22 01:15:34
问题 I would like to be able to render a remote collection fetched with <core-ajax> as such: <rendered-collection url="/api/items"> <custom-element value="{{ _it_ }}"></custom-element> </rendered-collection> where <rendered-collection> would look something like: <link rel="import" href="/core-ajax/core-ajax.html"> <polymer-element name="rendered-collection" attributes="url" noscript> <template> <core-ajax url="{{ url }}" response="{{ collection }}" auto handleAs="json"></core-ajax> <template

HTML import not deduping

由 青春壹個敷衍的年華 提交于 2019-12-22 00:43:12
问题 So the first fact section in this HTML import article states that html imports know better than to request (and execute - if javascript) resources multiple times. This works within the framework of HTML imports but doesn't work for other type of imports (as in javascript). In this network view of the devtools you can see Polymer.html being loaded first from javascript ( d3.js ) then again from HTML imports ( my-app.html ) which I wasn't expecting. Is there a way to explicitly tell HTML

How can i bind a dynamic function within a polymer component?

由 爱⌒轻易说出口 提交于 2019-12-22 00:27:08
问题 As far as my Polymer knowledge goes I can bind a function using the "on-*" syntax to a webcomponent method bind a function available in the global window namespace using vanilla html js binding (using onClick="...") But I want to bind a function (provided as property of datamodel objects) to the webcomponent template. One sidenote : Moving the datamodel objects to the global javascript namespace (i.e. window.*) is not an option. The example below does'nt work but reflects exactly my use case

Polymer 1.0: iron-pages not switching pages with children events

由 别等时光非礼了梦想. 提交于 2019-12-21 22:38:08
问题 I have a parent component with two children components in an "iron-pages" component. The parent should switch pages when it receives an event from one of the children. The problem is, when the event arrives at the parent component, it executes the code to switch children but nothing happens. But, if the code is executed on the parent component itself, then it works. My question is: Why the parent component is unable to switch pages when a child sends an event? Below is the code for the two

Polymer 1.0: How to design a modern authentication UX in Polymer if modals must go outside <paper-drawer-panel>?

由 前提是你 提交于 2019-12-21 21:28:44
问题 Our Challenges: It seems to me The Polymer 1.0 developer community faces the following challenges right now: We have no user auth UX example to follow. This Stackoverflow question requests a user authentication UX example. And describes why it's needed. This Github issue also documents multiple user requests for such a user auth UX example. And there has also been lots of anecdotal chatter on the Polymer Slack Site about this issue as well. Modals don't currently work inside <paper-drawer

Does a polyfill exist for getDestinationInsertionPoints?

由 喜夏-厌秋 提交于 2019-12-21 21:25:06
问题 I've come across a situation where it would be helpful to know whether a given node has been distributed into a content node. There's a native Shadow DOM function node.getDestinationInsertionPoints() that's very helpful for this purpose, but I don't see a version of this in the polyfill world. I can work around the need for this by doing my own inspection of a node's parent chain, but it'd be nicer to rely on the standard (?) getDestinationInsertionPoints() function. Does -- or will -- the

Polymer paper-dialog position

由 三世轮回 提交于 2019-12-21 20:04:28
问题 In my application I am using polymer's paper-dialog element. The dialog's styles always position it in the center, but I want it to have a minimum distance set between the dialog and the right side of the window, so when the window shrinks, the paper-dialog won't get closer to the right side, than the set distance. Is there any way that I can do it with CSS, or shall I use some other technic? 回答1: if you want to specified a distance between the dialog and the right side you might want to
订阅 polymer