polymer

Can't Use Polymer Element - “Failed to execute 'registerElement' on 'Document'”

北城余情 提交于 2020-01-01 05:15:07
问题 I created an element which which I'll simplify here for brevity, and I wanted to do an end-to-end process and see if it works. This is its bower.json file: { "name": "test-element", "version": "0.0.1", "authors": [ "my name" ], "description": "A description", "license": "MIT", "ignore": [ "**/.*", "node_modules", "bower_components", "test", "tests" ], "dependencies": { "polymer": "~0.9.0" } } I uploaded it to my test repo, and opened a new project in WebStorm. I did bower install test-element

Use external scripts inside a Polymer element

a 夏天 提交于 2020-01-01 04:54:14
问题 What is the recommended way to "require" external javascript inside of a Polymer element? For instance, I'm building a video group component that I want to display inside of a Slick carousel. For instance, my code might look like this for the custom element: <link rel="import" href="../bower_components/polymer/polymer.html"> <link rel="import" href="../bower_components/polymer-jsonp/polymer-jsonp.html"> <polymer-element name="polymer-video-group" constructor="VideoGroupElement" attributes="">

Polymer input change event

故事扮演 提交于 2019-12-31 22:25:42
问题 All I want is to be able to get the input from a polymer element <paper-input> and alert it onchange WITHOUT creating a custom polymer element. issues: on-change doesn't do anything I doubt this.value will do anything Pseudocode: <!DOCTYPE html> <html> <head><!--insert proper head elements here--></head> <body> <paper-input floatingLabel label="test" on-change="alert(this.value)"></paper-input> </body> </html> 回答1: I don't know if the OP wanted a change callback while typing...but for Polymer

How does one validate paper-radio-group element with required attribute

不打扰是莪最后的温柔 提交于 2019-12-31 05:15:15
问题 This is similar question as this question but it was not answered & is pre 1.0. I need to ensure that at least one paper-radio-button is selected on form submit I can place a required attribute to each paper-radio-button but this means every radio-button have to be selected. <iron-label> Type<br/> <paper-radio-group name="types" allow-empty-selection attr-for-selected="value" selected="{{model.type}}" noink > <paper-radio-button name="type" value="home" required> Home</paper-radio-button>

Paper-dialog shows up behind drawer-panel when placed in a custom element

为君一笑 提交于 2019-12-31 04:44:05
问题 The paper-dialog shows up behind drawer-panel when launched from a custom element. Here's the modified "my-greetings.html" custom element from polymer-starter-kit to show a dialog: <dom-module id="my-greeting"> <style> :host { display: block; } @media (max-width: 600px) { h1.paper-font-display1 { font-size: 24px; } } </style> <template> <paper-dialog id="bigDialog"> <h2>Scrolling</h2> <paper-dialog-scrollable> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor

Polymer Core-Ajax File upload

五迷三道 提交于 2019-12-30 09:53:52
问题 i want to upload a file from a form with core-ajax. Right now it my code looks like this: <core-ajax auto="false" method="POST" url="/file-upload" handleAs="json" on-core-response="{{handleResponse}}" contentType="multipart/form-data; boundary=---------------------------7da24f2e50046" params="{{item}}" id="ajax"></core-ajax> <form> <input type="text" name="Name" id="name"></br> <label class="formLine">File</label></br> <input type="file" name="File" id="file"></br> <paper-button raisedbutton=

Polymer: How to watch for change in <content> properties

馋奶兔 提交于 2019-12-29 08:43:09
问题 I'm just starting to learn Polymer. Here is a generic version of my polymer element: <polymer-element name="my-element"> <template> <style> :host { position:absolute; width: 200px; height: 100px; background-color: green; } </style> <p>my element</p> <content id="first-in"></content> <content id="second-in"></content> </template> <script> Polymer('my-element', { domReady: function() { alert(this.children[0].getAttribute('title')); //this returns the value I want to observe } }); </script>

Dynamically load Web Components / HTML Imports?

纵然是瞬间 提交于 2019-12-29 06:18:01
问题 How would you go about dynamically loading a web component - in response to a url route change for example? I won't know the requested component ahead of time, so could you simply use JavaScript to write the HTML import and then add the code to the page, or are there implications with this? Perhaps Google Polymer helps? 回答1: Considering just Custom Elements, you can call document.registerElement whenever you want. So from that standpoint, you can dynamically load script using any well known

Dynamically load Web Components / HTML Imports?

 ̄綄美尐妖づ 提交于 2019-12-29 06:17:07
问题 How would you go about dynamically loading a web component - in response to a url route change for example? I won't know the requested component ahead of time, so could you simply use JavaScript to write the HTML import and then add the code to the page, or are there implications with this? Perhaps Google Polymer helps? 回答1: Considering just Custom Elements, you can call document.registerElement whenever you want. So from that standpoint, you can dynamically load script using any well known

Angular Polymer data-binding

做~自己de王妃 提交于 2019-12-29 04:50:07
问题 I want to make two way data binding between Polymer and Angular, for this I am using Angu-poly library. Here is a link to an example which is working, while passing strings via name and age attributes: working. <x-kid bind-polymer ng-repeat="kid in kids" angupoly="{name:'kid.name', age:'kid.age'}"> </x-kid> But when I try to make it with passing an object via kid attribute, it seems that something goes wrong, here is the link: not working. <x-kid bind-polymer angupoly="{kid:'kid'}"> </x-kid>