polymer-2.x | 易学教程

Styling native input in Polymer 2.x?

阅读更多关于 Styling native input in Polymer 2.x?

问题 I am trying to implement this answer. Is there any way to bind an on-click or on-tap event of a <paper-button> to either of the following hidden input elements? my-form.html <iron-form> <form> ... <my-buttons></my-buttons> ... <input hidden type="reset"> <input hidden type="submit"> </form> <iron-form> Or to trigger those events in any way? i.e., I have dispatched an event from my <paper-button> as follows my-buttons.html <paper-button on-tap="_reset">Reset</paper-button> <paper-button on-tap

Expose specific element in ShadowDom to external JS using document.getElementById

阅读更多关于 Expose specific element in ShadowDom to external JS using document.getElementById

问题 I have a v0/Polymer 1 web component that I am upgrading to v1/Polymer 2. This web component dynamically builds a URI that loads an external JavaScript file. The external JavaScript file runs and loads an <iframe> into a <div> of my component. This external JS contains document.getElementById to load the <iframe> into the specified <div> . I have searched and haven't found a way to force the <div> element to be exposed/placed in the shady DOM . I have read that if I design the component

Polymer app-route: intercept refresh page

阅读更多关于 Polymer app-route: intercept refresh page

问题 I am struggling with getting out of the current situation: we have a polymer SPA ( A ) deployed on a certain server and bound to a certain url: http://example.com/A, we do need to show legacy pages of the old application for the time being, in order to do so, a new application ( B ) has been developed and bound to a different url (http://example.com/B). What B does is to frame the pages of the legacy app and exposing a button whose aim is to go back to the previous location by accessing the

Polymer2.0 - polymer testing is failing with error

阅读更多关于 Polymer2.0 - polymer testing is failing with error

问题 When I try to test polymer elements and run polymer test command, I am getting below error Installing and starting Selenium server for local browsers ---------- selenium-standalone installation starting ---------- --- selenium install: from: https://selenium-release.storage.googleapis.com/3.0/selenium-server-standa lone-3.0.1.jar to: C:\Users\xxxx\AppData\Roaming\npm\node_modules\polymer-cli\node_modules\se lenium-standalone\.selenium\selenium-server\3.0.1-server.jar --- chrome install: from:

how to include google-map in polymer#^2.0 as it was working in polymer 1.7

阅读更多关于 how to include google-map in polymer#^2.0 as it was working in polymer 1.7

问题 I have included api, before everything were working perfect in polymer 1.7, after upgraded to polymer ^2.0 google map does not renders. here is my code in main app page written polymer class base: <iron-pages role="main" selected="[[page]]" attr-for-selected="name" selected-attribute="visible" fallback-selection="404"> <jj-maps name="maps" user="{{user}}" sprof="{{sprof}}"></jj-maps> <jj-list name="list" > Jobs </jj-list> <jj-infos name="infos"> infos </jj-infos> <jj-contacts name="contacts"

Polymer: Uncaught TypeError: Cannot read property 'persistent' of undefined

阅读更多关于 Polymer: Uncaught TypeError: Cannot read property 'persistent' of undefined

when I try to hide drawer in Login page it occur error. I use dom-if for hiding menubar and according to it's syntax I used <template> tag. But it occur error. Polymer code  <template is="dom-if" if="[[_isLogin()]]"> <app-drawer id="drawer" slot="drawer" swipe-open="[[narrow]]"> <app-toolbar>Menu</app-toolbar> <iron-selector selected="[[page]]" attr-for-selected="name" class="drawer-list" role="navigation"> <a name="homepage" href="[[rootPath]]homepage">Homepage</a> <a name="profile" href="[[rootPath]]profile">Profile</a> <a name="temp" href="[[rootPath]]temp">Temp</a> <

Polymer 2.x iron-list slots and data binding

阅读更多关于 Polymer 2.x iron-list slots and data binding

问题 Has anyone had any success with using a slot in an iron-list? I can get the dom elements to show up in the slot but can't figure out how to do the data binding part. I am filling the slot with some elements that refer to the iron-list's item property with data bindings. Example: component-with-list: <dom-module id="component-with-list"> <template> <iron-list items="{{listData}}" as="item"> <template> <div> <div>[[item.name]]</div> </div> <slot name="listitem"></slot> </template> </iron-list>

In Polymer 2.0 how to observe edits to properties of an object bound to an element inside dom-repeat?

阅读更多关于 In Polymer 2.0 how to observe edits to properties of an object bound to an element inside dom-repeat?

(This question and code sample is for Polymer 2, but it's possible the same issue is present in 1.x) The Goal: I want to create an element (the Editor) that allows viewing/editing of the properties of certain types of objects, and another element (the List) that displays editable arrays of these objects, delegating the viewing/editing to the Editor element, while retaining control over the addition/removal of obejcts from the list. A to-do list is a good example of this (note: the Polymer to-do list examples floating around out there, as far as I'm aware, do not do what I need, read on to see

Does jQuery work well with Polymer 2?

阅读更多关于 Does jQuery work well with Polymer 2?

问题 There are many mixed answers. But they're all answers from a few years ago and relating to Polymer 1. Thanks. 回答1: It does work but it won´t work well. Have a look this. The only way jquery and polymer work well togehter is polymer 1 and shady dom but thats deprecated. 回答2: The question can be interpreted in two ways - can legacy jquery code create polymer components/custom tags? The answer is YES . The other interpretation is - can I use jquery INSIDE my web components? The answer is "maybe,

Best way to communicate between instances of the same web component with Polymer?

阅读更多关于 Best way to communicate between instances of the same web component with Polymer?

问题 I'm trying to sync some of my web component properties between instances of the same element so if one of this properties changes then the same property gets updated in all the instances with the corresponding binding and events. Note: I want to use the Polymer Data System Concepts for the communications between instances. Example my-element.html <dom-module id="my-element"> <script> Polymer({ is: 'my-element', properties: { myProp: { type: String, notify: true } }); </script> </dom-module>