polymer

Polymer 1.x: Databinding Arrays

筅森魡賤 提交于 2019-12-25 04:32:38
问题 Objective I want to databind the selected property in this element to the DOM (at <div>[[selected]]</div> ). After selecting a state (like "Texas"), I expect the state's name to appear in the upper left next to the pre-selected states of "Colorado,South Dakota" (inside the <div>[[selected]]</div> tag). But instead, it does not. Question What's going on here? How can I successfully databind the DOM to the selected property? And have the DOM update automatically with each new state that is

Polymer paper-dropdown-menu not working

♀尐吖头ヾ 提交于 2019-12-25 03:53:28
问题 Paper-dropdown-menu component seems to be working fine on the polymer website [ https://www.polymer-project.org/components/paper-dropdown-menu/demo.html ]. However, I downloaded polymer/web components 0.5.1 and the menu doesn't seem to render at all [on any browser]. [ http://idineth.com/garage-website/bower_components/paper-dropdown-menu/demo.html ] Any idea why this is the case? Polymer website seems to be using the same branch if I'm not mistaken. 回答1: Try adding these imports. <link rel=

How to dynamically create Polymer custom element after setting all attributes?

喜夏-厌秋 提交于 2019-12-25 03:52:00
问题 The problem is when I try to create custom element this way var el= document.createElement('my-el'); el.setAttribute('tag-model', "[[myBinding]]"); it creates element without its attributes. How to construct custom element with all its attributes and then append to HTML to initilize them? Thank you! 回答1: See this It basically says to do it like that: var dynamicEl = document.createElement("my-element"); dynamicEl.setAttribute("id", "my-element-id"); dynamicEl.setAttribute("greeting", "Hello,

How to call function defined inside Polymer Custom Element and pass arguments?

大兔子大兔子 提交于 2019-12-25 03:33:08
问题 I have html page using polymer builtin elements along with my customElement( my-form ) <dom-module id="my-form"> <template> <div> <paper-input id="inputName" label="Name" required error-message="Required Input" value="{{data.name}}"> Name </paper-input> <paper-input id="inputAge" label="Age" required error-message="Required Input" value="{{data.age}}"> Age </paper-input> <div class="rows layout horizontal"> <paper-button id='cancelBtn' tabindex="0">Cancel</paper-button> <paper-button id=

Multiple Validation of Paper-Elements in Polymer

[亡魂溺海] 提交于 2019-12-25 03:17:49
问题 I would like to validate multiple paper-element fields immediately. Right now it works perfectly with just one field. This one works for one field, but only if the focus is changed -> bad <template is="auto-binding"> <paper-input-decorator label="Number" floatingLabel error="is not a number" isInvalid="{{!$.input.validity.valid}}"> <input id="input" is="core-input" pattern="\d*"> </paper-input-decorator> </template> This one works for one field just in time -> better <template is="auto

Polymer- App Route with Sub Paging

ぃ、小莉子 提交于 2019-12-25 02:26:18
问题 ve read : https://www.polymer-project.org/2.0/toolbox/case-study#routing And: https://github.com/PolymerElements/app-route I think I am just confused how to use the subrouting component, but the documents and example I have read hasn't really gotten me anywhere. If anyone could point out the elephant in the room for me that would be great. What am I trying to Achieve? I have a list of items(called matters) which I display on my-matters.html (this page currently calls another custom element

Init polymer attributes before ready()

那年仲夏 提交于 2019-12-25 01:49:18
问题 When dynamically creating polymer elements in js, how to initialize attributes before ready() event? my code below: var el = document.createElement("my-elem"); el.setAttribute("myAttr", 123); // or el.myAttr = 123. the ready() event is fired before myAttr is set. actually I want it works like it does in HTML way: var div = document.createElement("DIV"); div.innerHTML('<my-elem myAttr="123"></my-elem>'); var el = div.children[0]; in this way, myAttr is set when ready() event working, but the

Setting the data-binding value in polymer that was obtained from a promise

时光怂恿深爱的人放手 提交于 2019-12-25 01:42:52
问题 I am trying to fetch the schedule data in JSON format, from the server and use that to render the schdule using a dom-repeat. The code works fine if I hard-code the JSON, but if I set it using fetch, it does not work. <link rel="import" href="../bower_components/polymer/polymer.html"> <dom-module id="xl-schedule"> <template> <h1> Excel Schedule </h1> <template is="dom-repeat" items="{{schedule}}"> <div># <span>{{index}}</span></div> <div>Event name: <span>{{item.name}}</span></div> <div>Date:

Polymer Starter Kit with Node, Express, and Puppeteer

半城伤御伤魂 提交于 2019-12-24 23:02:31
问题 Okay, I'm a newbie to all this so any help greatly appreciated. I've managed to use Node and Express to serve up Polymer Starter Kit (PSK) website from the Polymer build directory from a file I created in the home directory (server.js): // Node.js notation for importing packages var express = require('express'); // Spin up a server var app = express(); // Serve static files from the main build directory app.use(express.static(__dirname + '/build/es5-bundled')); // Render index.html on the

<content> within an anchor tag isn't switching cursor on hover

与世无争的帅哥 提交于 2019-12-24 21:58:08
问题 I should have specified that this is a polymer question and not native HTML. I have a template like this <template> <a href="{{ href }}"> <content></content> </a> </template> When I hover over the custom element my cursor is cursor:text and not cursor:pointer , this is an easy fix to apply cursor pointer, but I feel as if those kind of properties should be inherited. Is there any way to apply the content and inherit the a properties properly? Example on jsfiddle here Update: 1 An even bigger