polymer | 易学教程

Polymer 1.0.5: Select not working on paper-dropdown-menu

阅读更多关于 Polymer 1.0.5: Select not working on paper-dropdown-menu

问题 I can't seem to set a default selected option, if needed. Read the docs but no other properties, except for label works. <paper-dropdown-menu label="I Love:"> <paper-menu class="dropdown-content" selectedItem="Heroes Reborn"> <paper-item>Teen Wolf</paper-item> <paper-item>Heroes Reborn</paper-item> <paper-item>Once Upon a Time</paper-item> </paper-menu> </paper-dropdown-menu> No matter if I set a value on paper-item value="x" then <paper-menu selected="x"> nothing works. Do I need to run some

polymer paper-menu-button change the default size of icon

阅读更多关于 polymer paper-menu-button change the default size of icon

问题 Is there way to set the size of polymer paper-menu-button element. I think it is the icon size is set to 24px. I wish to have it as 20px but I cannot find a way to do it. Thanks Dennis 回答1: I tried it and it worked. Add this style to the Polymer element containing your <paper-menu-button> element. paper-menu-button /deep/ core-icon[role=img] { height: 20px; width: 20px; } I added [role=img] to increase the selectivity. 来源： https://stackoverflow.com/questions/25352296/polymer-paper-menu-button

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? 回答1: You

Tap listener for polymer iron-list item?

阅读更多关于 Tap listener for polymer iron-list item?

问题 I have a custom element that utilizes iron-list to display an array of objects. Each item is generated via a template as follows: <iron-list id="projectList" items="[[projects]]" indexAs="_id" as="projLI" class="layout flex"> <template> <div> <paper-material id="itemShadow" animated elevation="1"> <div class="item layout horizontal" onmouseover="hoverOver(this)" onmouseout="hoverOut(this)">  <!-- list item object

Polymer Tests fail waiting for the driver server to start

阅读更多关于 Polymer Tests fail waiting for the driver server to start

问题 I am following polymer's (2.0) official tutorial to run and test a sample application. When running the tests using polymer test or polymer test -l chrome , the following error shows up: Tests failed: {"value":{"stacktrace":"org.openqa.selenium.WebDriverException: Timed out waiting for driver server to start.\nBuild info: version: \u00273.7.1\u0027, revision: \u00278a0099a\u0027, time: \u00272017-11-06T21:07:36.161Z\u0027\nSystem info: host: \u0027silverdust\u0027, ip: \u0027127.0.1.1\u0027,

Polymer sample code not working in firefox

阅读更多关于 Polymer sample code not working in firefox

问题 I am trying out sample code provided by Google at https://www.polymer-project.org/1.0/start/first-element/intro. This is what I have so far: index.html: <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport"> <script src="https://polygit.org/components/webcomponentsjs/webcomponents-lite.js"></script> <link href="/my_components/icon

lateral communication in Polymer

阅读更多关于 lateral communication in Polymer

问题 Here is the problem: Any two Polymer elements may need to communicate. No assumption is made as to where these elements might be in the DOM (or shadow DOM), this means one event cannot simply bubble up to another element. The good old way to achieve this would have been to let events bubble up to the root node and then fire broadcast events on the root node for other elements to listen to. This approach however breaks encapsulation and seems to go against Polymer's overall design. AngularJS

Polymer communication between elements

阅读更多关于 Polymer communication between elements

问题 I want to achieve communication between child parent with Polymer element. Here my index.html <proto-receiver data="message"> <proto-element data="message"></proto-element> </proto-receiver> Both element have their respective "data" property properties: { data: { value: 'my-data', notify: true, } }, In proto-receiver, which is the parent I update "data" by handling simple click <template> <span on-tap="onClick">proto receiver: {{data}}</span> <content></content> </template> onClick: function

PolymerJS: Iron-Ajax - How to Bind Token to Headers Property?

阅读更多关于 PolymerJS: Iron-Ajax - How to Bind Token to Headers Property?

问题 I have a polymer-element and I want to apply a token as headers attribute. When I push the button an XMLHttpReqeust is send. The responsible iron-ajax element has a headers property with a string. I would like to change the string, and apply a different attribute. I've been told that normal compound bindings does not work and I should try computed bindings or just computed properties . But the problem seems to be the question, how to bind these computed properties or computed bindings to the

How to declaratively bind pseudo-boolean attributes like disabled/checked to boolean values?

阅读更多关于 How to declaratively bind pseudo-boolean attributes like disabled/checked to boolean values?

问题 Is there an easy way to bind attributes like disabled or checked to true/false properties? Something like <button disabled="{{myBooleanProperty}}">Ok</button> doesn't work as desired. If myBooleanProperty is false, this sets disabled="false" , which is true as far as HTML is concerned. Is there a filter expression that can hint to the binding parser that the attribute should be completely removed if the value is false? 回答1: See conditional attributes: http://www.polymer-project.org/docs