polymer

Polymer Clone Objects

由 倾然丶 夕夏残阳落幕 提交于 2020-01-04 06:20:15
问题 How can we clone an object in Polymer? Example this.colorsAsc.push({color: 'red'}); this.colorsDesc = this.colorsAsc.reverse(); this.colorsDesc[0].color = 'blue'; // Both will be blue doing this I can do it in these many functionalities What is the most efficient way to deep clone an object in JavaScript? but I wonder if there is a way in Polymer to do that? Angular does it https://docs.angularjs.org/api/ng/function/angular.copy 回答1: You can try the following hack: this.colorsDesc = JSON

Polymer: Trouble styling the <core-submenu>

由 雨燕双飞 提交于 2020-01-04 06:04:17
问题 I've created a simple menu inside a <core-drawer-panel> element using <paper-item> with the following: <paper-item noink> <div class="core-menu-item"> <core-icon icon="maps:beenhere"></core-icon> My Places </div> </paper-item> As you can see, I've wrapped the insides with a <div> to adjust the icon and text style + positioning. Achieving this effect: So my question is, how can I style a <core-submenu> in a similar way to achieve the same results? I've tried following the documentation but

Polymer 1.0: Sorting dom-repeat

由 ￣綄美尐妖づ 提交于 2020-01-04 05:48:04
问题 How do I sort the data in this jsBin by item.order. (Documentation) http://jsbin.com/zoqaqivaba/edit?html,output <html> <head> <title>My Element</title> <script data-require="polymer@*" data-semver="1.0.0" src="http://www.polymer-project.org/1.0/samples/components/webcomponentsjs/webcomponents-lite.js"></script> <script data-require="polymer@*" data-semver="1.0.0" src="http://www.polymer-project.org/1.0/samples/components/polymer/polymer.html"></script> <base href="http://element-party.xyz/"

How to import custom fonts into an app or element using Polymer?

由 五迷三道 提交于 2020-01-04 05:43:30
问题 How does one import custom fonts into a Polymer app or element? Per @tweightman on the Polymer Slack Channel: <link rel="import" href="/bower_components/polymer/polymer-element.html"> <link rel="import" href="/bower_components/my-typography/my-typography.html"> <dom-module id="my-page-styles"> <template> <style include="my-typography"> :host { @apply --my-custom-font-mixin; } </style> </template> </dom-module> Stumbled across a possible solution: instead of using @font-face rules inside my

Polymer 1.0 dynamic template with dom-repeat

由 醉酒当歌 提交于 2020-01-04 05:32:25
问题 I have a scenario where I would like to create dynamic template elements that will be used with Polymer's dom-repeat . My current prototype is the following (JSbin demo): var domRepeat = document.createElement('template', 'dom-repeat'); domRepeat.items = ['a', 'b', 'c']; var div = domRepeat.content.ownerDocument.createElement('div'); div.innerHTML = '[[item]]'; domRepeat.content.appendChild(div); document.body.appendChild(domRepeat); Polymer.dom.flush(); However , this does not work as

Polymer 1.0: Two-way data binding: <iron-form> to/from Firebase

由 倾然丶 夕夏残阳落幕 提交于 2020-01-04 05:20:01
问题 I want to two-way databind the field values of an iron-form to a Firebase node (representing user-defined settings , for example). settings.html <dom-module id="my-settings"> <template> <firebase-document location="[[firebaseUrl]]" data="{{form}}"> </firebase-document> <form is="iron-form" id="form"> <paper-checkbox id="history" name="history" on-change="_computeForm" >Save history </paper-checkbox> <!-- ... --> <!-- All types of form fields go here --> <!-- ... --> </form> </template>

Polymer nested app routes are not mapping correctly

由 末鹿安然 提交于 2020-01-04 04:38:05
问题 I am trying to get some basic routes right. I'm using Polymer 1.5.0 and I'm having problems using nested routes. I'm using app-route 0.9.2 As this post suggests, Polymer uses a decentralized approach in routing. Therefore I decided to do the following: <app-route route="{{route}}" pattern="/:page" data="{{data}}" tail="{{tail}}"> </app-route> <iron-pages selected="{{data.page}}" attr-for-selected="title" fallback-selection="404"> <pgarena-home-app title="" route="{{tail}}" ></pgarena-home-app

Polymer——Web Components的未来

由 白昼怎懂夜的黑 提交于 2020-01-04 02:50:51
什么是polymer？ polymer由谷歌的Palm webOS团队打造，并在2013 Google I/O大会上推出，旨在实现Web Components，用最少的代码，解除框架间的限制的UI 框架。 Everything is an element,一切皆组件，是polymer的核心思想 polymer 可以通过Twitter的包管理器bower，方便的进行组件（Elements）及包的依赖管理，不必自己从git上下载组件。 polymer分层结构： 元素层（Elemets）， 分为UI elements（如select、tab）、 non-UI elements（如ajax、animate） 核心层：polymer.html+polymer.js，是创建polymer element的必要依赖。 基础层：platform.js，是平台兼容，和响应式代码实现的必要依赖，创建应用必须首先引入它。其中大部分API最终将成为原生浏览器API。 通过<link rel="import" href="component-name.html">方式引入组件，即Web Components的Imports规范。 Web Components是polymer的一个很重要的基础，我们有必要来了解一下： Web Components？ 它是一些规范，旨在以浏览器原生的方式向外提供组件

2017前端框架何去何从

由 好久不见. 提交于 2020-01-04 00:34:42
>这篇文章将从 AngularJS ReactJS Polymer 这几个流行的框架入手，分析前端框架在这几年发展中的关键技术点，作为2015前端技术选型的参考。摘要: - 初体验 - 技术特点 - 组件化 - 应用架构 ### 总结 **1. 初体验** 拿TODO来作为引子好了. ![](//upload-images.jianshu.io/upload_images/8373224-4e10488b2196f18d.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240) Angular 的实现 ![](//upload-images.jianshu.io/upload_images/8373224-5966342b1a65597b.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240) React的实现(非flux架构) ![](//upload-images.jianshu.io/upload_images/8373224-fdd1c5436dfee33e.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240) Polymer的实现 ![](//upload-images.jianshu.io/upload

PhpStorm relative path to resource root

由 陌路散爱 提交于 2020-01-03 17:20:36
问题 I use PhpStorm 9 and I have project structure similar to this: src/ elements/ element-alfa/ element-alfa.html element-alfa.scss templates/ application.html index.html I use Polymer so I have to import the elements when I use them. I also use AngularJS, which direct the app after load to application.html , but in fact paths are like from the index.html file. <link rel="import" href="elements/element-alfa/element-alfa.html"> I have set the src/ directory as RESOURCES ROOT so it does not tinged
订阅 polymer