polymer

How can I know that Template Repeat has finished?

由 大兔子大兔子 提交于 2019-12-18 06:53:51
问题 Element needs some time for template-repeat to render all content, so paper-spinner is used to notify the user to wait. How can I know that template-repeat has finished so I can turn off the spinner? And related question: how can inner element "item-details" be selected? Again, template-repeat has to be finished first. Here's the code I am using: <polymer-element name="item-list"> <template> <paper-spinner active></paper-spinner> <template id="repeat_items" repeat="{{ item in car.items }}">

Double Brackets [[ ]] vs Double Braces {{ }} in Polymer

由 点点圈 提交于 2019-12-18 05:39:28
问题 What's a succinct way to explain the difference between double brackets ( [[...]] ) and double braces ( {{...}} ) in Polymer 1.0? For instance, in the documentation for the <iron-list> element the sample HTML shows: <template is="dom-bind"> <iron-ajax url="data.json" last-response="{{data}}" auto></iron-ajax> <iron-list items="[[data]]" as="item"> <template> <div> Name: <span>[[item.name]]</span> </div> </template> </iron-list> </template> Why is data bounded by double braces in one spot (

Data binding/updating between parent and child using <content> tag in Polymer1.0

由 喜夏-厌秋 提交于 2019-12-18 05:25:16
问题 I have a slider element that contains list of slides and a img to show hovered slide as shown below. I am binding currentImage between custom-slide (child) and custom-slider (parent) CASE I custom-slider.html <template> <div> <custom-slide current-image="{{currentImage}}"></custom-slide> <custom-slide current-image="{{currentImage}}"></custom-slide> <custom-slide current-image="{{currentImage}}"></custom-slide> </div> <img src="{{currentImage}}"> </template> It works perfectly when I used

Polymer 1.0 - injectBoundHTML() alternative

由 醉酒当歌 提交于 2019-12-18 04:53:10
问题 What's the Polymer 1.0 equivalent to injectBoundHTML()? (i.e. appending HTML strings to nodes within a Polymer element and having data bindings resolve) A JSbin example - http://jsbin.com/jufase/edit?html,output EDIT: don't have enough SO cred to accept my own answer yet, but it should be down below somewhere. TL;DR - use "dom-bind" templates 回答1: Although as techknowledgey pointed out it's not really supported well yet. The following seems to do the trick. function injectBoundHTML(html,

Polymer + Firebase (Polymerfire): <firebase-query> not working inside single page app view (with <firebase-app> located in my-app.html)

由 此生再无相见时 提交于 2019-12-18 04:28:05
问题 I'm trying to push data to Firebase using Polymerfire and the Polymer App Toolbox template: my-app.html contains a configured <firebase-app> component. my-models.html (which is a page configured in my-app.html routes) contains a <add-model> component <add-model> is a form with a <firebase-query> , <firebase-auth> , input, and submit button. I attempt to push data using <firebase-query> with the following function in the add-model.html Polymer object: Polymer({ is: 'add-model', properties: {

Polymer elements within angular 2 component

由 故事扮演 提交于 2019-12-18 01:13:09
问题 I have a set of custom polymer elements, that I would like to use within an angular 2 application. It seems like there's a problem concerning the content tag of the polymer element. The content of the element gets rendered at the wrong place within the polymer element, if the element is located within an angular 2 component. Example: The template of my polymer element "my-button" looks like this: <template> <button> <content></content> </button> </template> Use outside angular When I use this

Make CORS Request with Polymer iron-ajax and Node.js

由 回眸只為那壹抹淺笑 提交于 2019-12-17 21:35:02
问题 I am trying to retrieve data using Polymer and Node, but am struggling to get a valid response back. I get a pre-flight response error that says the access-control-allow-origin is not allowed. I am running Polymer on localhost:4001 and Node on localhost:8080 . How can I configure either Node or the Client to load a response? Client <iron-ajax id="ajaxUser" url="http://localhost:8080/node/api/mssql/login" method="post" handle-as="json" Content-Type="application/json" headers='{"Access-Control

How to query elements within shadow DOM from outside in Dart?

由 蓝咒 提交于 2019-12-17 19:37:34
问题 How can I select nodes within shadow DOM? Consider the following example: structure of "unshadowed" DOM <app-element> #shadow-root <h2></h2> <content> #outside shadow <h2></h2> </content> <ui-button> #shadow-root <h2></h2> </ui-button> </app-element> index.html <body> <app-element> <!-- OK: querySelect('app-element').querySelect('h2') --> <!-- OK: querySelect('app-element h2') --> <!-- There is no problem to select it --> <h2>app-element > content > h2</h2> </app-element> </body> templates

Can I access the shadow DOM using jQuery?

由 你离开我真会死。 提交于 2019-12-17 18:48:59
问题 I defined a component with polymer like this: <polymer-element name="my-component"> <template> <div id='test'>CONTENT</div> </template> </polymer-element> Now I want to access the shadow dom, for example: to get the content of div id='test' var x = $("div#test").html(); The given code doesn't work. Can I access the shadow dom with jquery? 回答1: No, not outside of the Polymer element. After reading up on Polymer, it looks like you can only have access to the shadow-DOM of Polymer elements in

Bootstrap.js not working in Polymer components

由 冷暖自知 提交于 2019-12-17 18:24:33
问题 I'm currently working on translating our current Dart Web UI project to Polymer.dart. We use Bootstrap 3 for the front-end styling and many web animations (e.g. dropdown menus, modals, tooltips). However after I translated one Web UI component into Polymer, all the Bootstrap JavaScript stopped working for the sub component, since it was now encapsulated in the ShadowDOM. To access an element in the ShadowDOM from Dart I have to use the shadowRoot field, and from JavaScript in Chrome I have to
订阅 polymer