polymer | 易学教程

How do you get HTML5 inputs to validate if they are inside Polymer Web Components?

阅读更多关于 How do you get HTML5 inputs to validate if they are inside Polymer Web Components?

I am using Polymer Web Components and my application targets Chrome. On my form, outside the Web Components I have an input type='number', when I enter 'a' into the input and submit the form, I get a tooltip that says "Please enter a number." However, I have another input type="number" that is in the Shadow DOM of a web component. When I enter 'a' into that field and submit the form, I get no tooltip. Is there anyway to make the behavior more consistent? I'm not seeing the same problem you describe (using Chrome 36 and Polymer 0.3.3). The form validation works as expected with the following

Is there a Polymer component that simplifies communications with MongoDB?

阅读更多关于 Is there a Polymer component that simplifies communications with MongoDB?

Given the promise Polymer and web components have in simplifying development I am wondering if anyone has developed a wrapper component that simplifies talking to a MongoDB backend? Does anyone know of one? Is this a sane idea? I guess it would need a custom server-side piece, but even so, I expected that lots of people would have written one, but I cannot find any; or is this a case where there are so many options that I should write my own node/express/mongo server? Or is it that the AJAX component will do all the heavy lifting and I just need to use that? Puzzled Andy I think that you

Using one iron-ajax element for multiple requests

阅读更多关于 Using one iron-ajax element for multiple requests

问题 Theoretically, it should be possible to use one iron-ajax element for multiple requests by setting the auto attribute and then repeatedly setting the url property on the element. iron-ajax has a property called activeRequests , which is a read-only array, so it seems like it has supports for queueing up multiple requests simultaneously. However in practice it does not appear to work. For example, in the JS Bin below, I retrieve a list of book IDs for books that contain the word polymer , and

How to publish Polymer 3.x custom element?

阅读更多关于 How to publish Polymer 3.x custom element?

问题 I am learning polymer3.x. I made a dummy polymer element. Now i wanted to know how to publish online and use it in some other framework(eg: angular app). I completed the requirements as mentioned in https://www.webcomponents.org, included License file tagged versions added README file But while doing "preview element" i got Error - 12: Missing bower.json. Currently, only Bower is supported. From Polymer version 3, the Polymer team recommends npm instead of Bower . How to publish my polymer

How do you escape braces {{var}} in a polymer template?

阅读更多关于 How do you escape braces {{var}} in a polymer template?

How do you escape curly braces in a Polymer template? I've seen both of these as suggestions but they both throw "Invalid expression syntax" errors. {{ '{{' }}var{{ '}}' }} {{ '{{var}}' }} How about {{'\{{var}\}'}} ? Seems to work. To escape things like {{..asdf..}} or [[..asdf..]] in regular HTML code in the template use  in between: {{..whatever..}} 来源： https://stackoverflow.com/questions/24966597/how-do-you-escape-braces-var-in-a-polymer-template

How to trigger a iron-ajax request on a paper-button click?

阅读更多关于 How to trigger a iron-ajax request on a paper-button click?

I would like <iron-ajax> to POST dynamic data from a <textarea> to http://example.net when I click a <paper-button> element: function get_data() { return {content:document.getElementById("mycontent").html()} } <html> <head>  </head> <body> <iron-ajax url="//example.net" ></iron-ajax> <paper-button id="mybutton"></paper-button> <textarea id="mycontent"></textarea> </body> </html> How can I combine the iron-ajax and paper-button elements to send the data to the server? You need to wrap your polymer elements in a tag that will register as polymer element. You can use dom-bind in

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

Polymer 2.0: Notify and reflect to attribute

阅读更多关于 Polymer 2.0: Notify and reflect to attribute

问题 I'm new to this framework and would love to see some useful and simple examples of notify and reflect to attribute properties being put to use. Please keep the examples simple or add explanation for whatever code you provide. 回答1: Notify: can be set to True|False. Let's say you have parent-element and child-element . Working example parent-element.html: <dom-module id="parent-element"> <template> <child-element foo="{{test}}"></child-element> </template> <script> Polymer({ is: "parent-element

Polymer custom element styles with HTML imports

阅读更多关于 Polymer custom element styles with HTML imports

问题 I have a custom element which is using styles that are being imported via an HTML import. As of Chrome Stable (35.0.1916.114) and Canary (37.0.2008.2 canary), those styles are no longer being applied to the templates defined inside the custom element. Safari (7.04) and Firefox Aurora [29.0a2 (2014-02-11)] looks good. Is there a regression in Chrome ? E.g. my imports.html looks like: <link rel="stylesheet" href="/assets/stylesheets/libs/bootstrap.min.css" media="screen"> <script src="/assets

polymer search input text from icon

阅读更多关于 polymer search input text from icon

I am trying to do have a button (search) once click it would open a search box. It's pretty much the same thing that the polymer website does today: https://www.polymer-project.org/0.5/ How can I achieve that ? Thanks Here is a solution based on the app-bar used in Polymers 1.0 documentation: <link rel="import" href="bower_components/polymer/polymer.html"> <link rel="import" href="bower_components/paper-icon-button/paper-icon-button.html"> <link rel="import" href="bower_components/iron-input/iron-input.html"> <dom-module id="search-bar"> <template> <style> #search { display: -webkit-box;