polymer-2.x | 易学教程

Message boxes in Polymer applications

阅读更多关于 Message boxes in Polymer applications

问题 I am working on my first bigger Polymer application and currently have around 30 components. Most of the components need to be able to display (modal) message boxes. For this I implemented a message box component wrapping paper-dialog (similar to other message box components available). What I don't like is that in every component which wants to display message boxes I need to define an element <my-message-box id="message-box"></my-message-box> and then call it like this this.$["message-box"]

How do I build a Polymer 2.x project with Polymer CLI?

阅读更多关于 How do I build a Polymer 2.x project with Polymer CLI?

问题 Can anyone point me to a tutorial that uses Polymer 2 and polymer-build from Polymer CLI? When I use any example in the polymer-starter-kit and use polymer serve , it works fine; but when I use polymer build and serve the bundled or unbundled directory, I get 404 errors. I have even updated to the newest alpha version of polymer-cli . Also, using https://github.com/tony19/generator-polymer-init-2-x-app generators have the same problem. 回答1: I also spent quit a bit of time to figure this one

Polymer2.0- Trying to download DIV content of custom element

阅读更多关于 Polymer2.0- Trying to download DIV content of custom element

问题 I am trying to download div content of custom element using document.getElementById of the div and trying to implement download option from the JS FIddle - http://jsfiddle.net/evx9stLb/ From console, I am getting below error pen.js:6 Uncaught TypeError: Cannot read property 'innerHTML' of null at download (pen.js:6) at HTMLButtonElement.onclick (index.html:15) HTML: <head> <base href="https://polygit.org/polymer+v2.0.0/shadycss+webcomponents+1.0.0/components/"> <link rel="import" href=

Understanding two-way databinding in Polymer

阅读更多关于 Understanding two-way databinding in Polymer

问题 I'm new to polymer, and I've been reading the docs and playing around with it a little bit, but I'm having some difficulty understanding the difference between the [[]] one way data flow, and the {{}} two way data flow. Can anyone help me understand the difference? 回答1: For example handing data from one element down to one of it's child elements is considered one-way-data-binding. If this data get's modified in the child element the change is also reflected in the parent. This is made

Polymer 2.0 - bootstrap classes are not working

阅读更多关于 Polymer 2.0 - bootstrap classes are not working

问题 I am trying to use bootstrap CSS classes with polymer2.0 but it is working HTML: <head> <base href="https://polygit.org/polymer+v2.0.0/shadycss+webcomponents+1.0.0/moment-js+saeidzebardast+0.7.2/components/"> <script src="webcomponentsjs/webcomponents-lite.js"></script> <link rel="import" href="polymer/polymer.html"> <link rel="import" href="moment-js/moment-js.html"> </head> <link rel="import" href="polymer/polymer-element.html"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com

Showing a gray backdrop with a mixin

阅读更多关于 Showing a gray backdrop with a mixin

问题 I have a small window that I'm inserting into my page (and removing when the page is closed). I want a grayed-out background behind this window, as on dialogs. So I thought I'd use paper-dialog-behavior or iron-overlay-behavior as a mixin, and set this.withBackdrop = true in my ready() method. However, when I add ...extends Polymer.mixinBehaviors([Polymer.IronOverlayBehavior], Polymer.Element) or ...extends Polymer.mixinBehaviors([Polymer.PaperDialogBehaviorImpl], Polymer.Element) to this

Linking 2 custom elements through parent

阅读更多关于 Linking 2 custom elements through parent

问题 I have 2 custom child elements that I am trying to pass data between through a parent element. My code in the parent html looks something like this: <dom-module id="parent-html"> <template> <child-elem1 id="ch1"></child-elem1> <child-elem2 id="ch2"></child-elem2> </template <script> window.addEventListener('WebComponentsReady', function() { class WebApp extends Polymer.Element { static get is() { return 'web-app'; } static get properties() { return { } } ready () { super.ready(); this.$.ch1

Firing an event from parent to child element in Polymer 2.0

阅读更多关于 Firing an event from parent to child element in Polymer 2.0

问题 Can somebody provide an example of sending an event from parent to child in Polymer 2.o custom element? I tried with following: <child-element> this.addEventListener('dbinit', this._evdbInitStatus); and <parent-element> this.dispatchEvent(new CustomEvent('dbinit', {detail: {kicked: true}})); The call back does not get invoked. 回答1: This is not really related to Polymer itself, as you can see in the documentation on how events work, here, events capturing stops at the element that triggered

Polymer 2.0 app crashes Internet Explorer 11

阅读更多关于 Polymer 2.0 app crashes Internet Explorer 11

问题 I have a polymer 2.0 app that is transpiled to ES5. It works well in Edge, Firefox, and Chrome; however, when I open it in Internet Explorer 11 on Windows 7, 8.1, or 10, the program crashes. Sometimes it will render without most of the styles, other times it will crash before the page is even rendered. Once, it said that a script was running long and asked if I wanted to stop the script. Doing this also crashed IE. Since the developer tools won't open, I'm not able to debug this. What

How to render html entity symbols in a dom-repeat?

阅读更多关于 How to render html entity symbols in a dom-repeat?

问题 I ask this questions because all existing solutions which are existing like: polymer issue 432 polymer issue 1331 entities-in-polymer-element-definition for example are outdated and/or not working any longer. I have a simple dom-repeat statement: <template is="dom-repeat" items="[[items]]"> <a target="_blank" href="[[item.url]]">[[item.label]]</a> </template> As you can see here im showing a list of urls. When the datasource now contains html entities: this.push('items', { label: '© Google