Polymer中动态生成HTML的数据绑定?

当我在-标记中写入以下内容时,一切正常: <ul id="breadcrumbList" class="breadcrumb"> <li><a on-click="{{breadcrumbClick}}">{{overviewName}}</a></li> </ul> 我没有找到任何关于是否可以或不可能对动态生成的内容使用数据绑定的文档。这可以通过injectBoundHTML()实现。我们尚未对其进行记录,但您可

Polymer 如何使用web组件修改标准HTML元素?

我已经阅读了如何创建自己的web组件,这些组件可以被分配自定义属性和封装在ShadowDOM中的标记。但是如何修改已经注册的标准HTML元素呢 我注意到这样做是因为可以向标准HTML元素添加flex和layout等属性 <div horizontal layout> <div>Alpha</div> <div flex>Beta (flex)</div> <div>Gamma</div>

Polymer 当与包含在其中的可聚焦元件相互作用时,如何保持对定制聚合物元件的关注?

我已经创建了一个自定义的聚合物元素,它扩展了造纸厂 该元素包含其他元素,如“纸张”按钮和其中的纸张输入。这些元素最初是隐藏的意思,你只看到一个晶圆厂 当自定义元素在不同的页面上实现时,单击它会获得焦点,因此自定义元素会将形状从圆形更改为矩形,并显示其中的纸张按钮和纸张输入元素 当您离开自定义元素(例如在页面的另一部分)单击时,该元素将从矩形变回圆形,因为它不再具有焦点。但是,当与纸张按钮和纸张输入交互时,这些元素会获得焦点,因此自定义元素会失去焦点,并将形状更改回此处不需要的圆形。当与自定义元素

Polymer 聚合物重复事件参数

我正在研究聚合物,这方面很新 我有一个使用模板进行迭代的列表。上面需要一个移除按钮。单击remove,我正在调用一个函数。我们如何知道调用了哪个列表项,以便我可以删除该项 <template repeat="{{ data in listData }}"> <div> <img src="../../Styles/images/edit.png" alt=""> <img src="../../Styles/images/remove.png

Polymer 聚合物1.0的最佳演示应用程序

谷歌是否计划开放源代码应用程序,如I/O 2015年会议中提到的谷歌I/O网络应用程序(爱荷华州),以展示最佳实践 我认为,为爱荷华州这样一个非常复杂的应用程序提供有价值的见解将极大地有利于Polymer 1.0的采用者 此外,是否有计划将Polymer gmail即升级至1.0 谢谢。。这是应用程序布局——一组元素,以及可用于构建应用程序布局的指南和模板 该链接取自第一个资源,它本身就是一个很好的资源。这里:或者,由于Polymer完全是客户端的,您也可以在谷歌音乐播放器或Youtube网页上

Polymer 使用neon动画页面时,如何在页面更改后从顶部开始

使用霓虹灯动画页面时,如果页面更改事件在您不在当前页面顶部时触发,它将在页面下方同样切换到新页面。默认行为应该是切换页面并显示新页面的顶部 加载新页面后是否有办法滚动到页面顶部?我可以通过将scrollTop设置为包含neon动画页面的元素来解决此问题。我通过按下按钮更改neon动画页面时调用的功能来完成此操作 document.querySelector('my-container').scrollTop = 0; 根据我的经验,最好每个页面都有自己的纸张标题面板、工具栏等。然后,当您更改页

Polymer 聚合物1.0纸张项目垂直校准在IE中发布

为什么纸张项目的内容在IE中不是垂直居中的,就像这里示例中的Chrome一样: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>JS Bin</title> <base href="//polygit.org/components/"> <script src="webcomponentsjs/webc

Polymer 聚合物中模板的扩展

我正在尝试编写一个自定义DOM助手,类似于DOM if和DOM repeat,它扩展了template。它接受一个属性,比如部分名称。基于这个部分名称,它将做出ajax响应,并获得模板的实际内容部分,该部分还包含聚合数据绑定标记。所以它基本上需要对内容进行延迟渲染 问题是什么?对不起,问题是在收到ajax响应后如何动态更改polymer中模板的内容。如何呈现基于标记的接收模板。最初没有内容。此行基本上位于Dom模块的主模板内。添加了一个plunker

Polymer 我如何给铁名单的备用行上色

我有一个铁链表,其中包含来自数据库的查询行。我想给交替的行涂上颜色,使它们突出 我的猜测是,我想通过从索引中计算一些东西来创建一个类似“偶数”的类。在行模板中放置一个类$=“[[calculatedValue]]”。然后,我可以根据偶数类的存在为行着色 然而,我对如何做到这一点感到困惑。我在宿主元素中创建的任何属性都只是一个属性。如何扩展它,使每一行都有一个计算。您甚至不需要声明类,因为您可以使用简单的CSS来实现这一点 例如 简单的解决方案是最好的。这不太好用。有时颜色会重复,因为“铁名单”会

Polymer 纸张项目价值未以铁的形式使用

我正在使用一个铁的形式与得到的要求。它需要1+个食物,而不是querystring值的值。不知道我做错了什么 ,虽然是纸质菜单,我也有同样的问题 无论如何,您必须创建隐藏输入并将选定项指定给隐藏元素的值 最好在自定义元素中创建属性,该属性将保存选定的参数。 因此,在您的情况下,它将是: <paper-dropdown-menu label="foods" name="foods"> <paper-listbox class="dropdown-conten

Polymer Vaadin cache.js

我正在尝试使用复选框构建treeSelectView。 它实现了HasValue,因此setValue将移交一个应该选中复选框的节点列表。无论何时调用函数,都会选中这些复选框。下面是下降部分。当treeSelectView到达客户端时,一个名为https://localhost:8443/VAADIN/static/client/client-调用BF4676DDAFDA5E40AE93EFEB692AAD5.cache.js,将树中的所有复选框设置为未选中。这是注销输出: Sending xh

Polymer 聚合物-不能单击元素外部的事件以关闭自身

聚合物1* 我必须写我自己的下拉菜单。当用户在元素外部单击时,我需要关闭菜单。但是,当用户在元素外部单击时,我无法捕获事件,因此我可以关闭菜单 你知道我做错了什么吗 编辑:我正在学习纸张菜单按钮,当我在元素外部单击时,该按钮将关闭纸张列表框。。。。但我看不到它在哪里捕捉到那个事件 改留 取消预订 删除预订 (功能(){ "严格使用",; 聚合物({ is:“sp转介预订下拉列表”, 行为:[聚合物.IronControlState], 特性:{ }, 听众:{ “点击”:“关闭”, '单击':

Polymer 混淆聚合物属性反射与双向数据绑定的区别

我正在尝试制作一种聚合物元素,它可以根据SMF论坛对用户进行身份验证。我希望元素公开一个“user”属性,该属性最初是一个空对象{},但是如果/当元素发出ajax请求并能够对用户进行身份验证时,该对象将包含有关用户的详细信息(和身份验证令牌),以便在应用程序的其余部分中使用。应用程序的其余部分位于元素的内容部分,只有在进行身份验证时才会显示 因此,应用程序的结构如下 <smf-auth login="login/url", fail="fail/url", splash="initial/

Polymer 右侧的核心动画页/demos/simple.html幻灯片在FF31中不起作用

我正试图从本地bower安装的文件中找出为什么“从右开始幻灯片”转换在FF中不起作用。 有趣的是,从polymer页面调用相同的文件是可行的 更新或重新安装bower文件没有帮助 thx提前动画页面的最新实现和文档 我在Chrome中实现了这一点,包括了特定的转换组件。如果你看一下它的源代码,这就是 ... <link rel="import" href="bower_components/core-animated-pages/core-animated-pages.html">

Polymer Google自动完成地址和搜索词聚合元素

我在谷歌搜索地址聚合元素,但我没能找到,所以我决定自己写。 但是我得到了google.maps作为对象,但是google.maps.places在控制台中是未定义的,下面是我的示例代码 <script src="http://maps.googleapis.com/maps/api/js?libraries=places"></script> <polymer-element name="google-placesearch"> <link rel="i

Polymer ng聚合物元素支持多个数据绑定

我创建了一个简单的年龄滑块web组件,它接受名称和年龄。像下面这样 所以我想用这个来表示角度。使用ng聚合物元素,我只能绑定一个变量,如下代码所示 是否可以用ng聚合物元素绑定两个变量

Polymer 如何将所需属性传递给元素构造函数

我有一个像这样的聚合物自定义元素 <script src="http://www.polymer-project.org/platform.js"></script> <script src="http://www.polymer-project.org/polymer.js"></script> <polymer-element name="my-foo" constructor="MyFoo" attributes="controlle

Polymer 聚合物卡滞不起作用

我试图在聚合物元件内部使用ondblclick,但我无法使其工作 我知道我可以只使用ondblclick=“someFunction()”,但我需要访问双击的元素模型,类似于点击事件: event.target.templateInstance.model.myModel; {{btnText}} 聚合物({ btnText:'双击我', btnDblClick:函数(事件){ //在实际代码中,我需要使用 //event.target.templateInstance.model //就

Polymer 使用HTML导入来自JS的相对路径资源

我有一个(聚合物)网络组件,我想让人们以跨来源资源共享(CORS)的方式访问它。这很好,但我不确定如何从组件内的JS代码中为图像和JSON文件等资源提供相对路径。它们被解释为相对于包含页面,而不是相对于HTML导入。我想我需要的是一个JS变量,它给出导入的html文件的路径。相对路径很重要,因为我还希望人们能够轻松地将其部署到自己的站点,而不是依赖到资源副本的硬编码路径 例如,您在example.com上加载index.html,它具有: <link rel="import" href="

Polymer 0.8中的嵌套x重复元素

是否可以执行以下操作: <template is="x-repeat" items="{{dataSource}}"> <!--called item--> <tr> <template is="x-repeat" items="{{columns}}"> <!--also called item--> <td data-titl

Polymer 聚合物1.3 dom重复两个阵列

我需要一个dom repeat在一个数组上循环,对于每个项目,我还需要在同一索引位置的第二个数组的一个元素 <template is="dom-repeat" items="[[my_array1]]"> <div>[[item]]</div> <div>[[my_array2[index]]] </div> <!-- this does not work --> </template> [[项目]

Polymer 在“聚合”中的“纸张”工具栏上定位图标

我希望能够将纸张图标按钮放置在纸张工具栏的右/末端。这就是我尝试过的 <paper-toolbar class="toolbar" justify="end"> <paper-icon-button icon="menu" drawer-toggle></paper-icon-button> <span class="title">{{page}}</span> <paper-icon-button ic

Polymer 2.x:ES6基于类的语法、元素定义

,有以下代码位: class MyElement extends Polymer.Element { static get is() { return 'my-element' } 我的问题是:第一行中的MyElement位是否必须与第二行中的MyElement位匹配?第一位是否受到第二位的约束?反之亦然?否,类名与从isgetter返回的元素名无关。例如,类可以命名为XFoo,元素名为myapp: class XFoo extends Polymer.Element { static

使用基本URL在web服务器上托管Polymer应用程序

如果我采取这种方法,在当地效果很好。 我可以导航到,并且指向3个视图的所有链接都可以正常工作 现在,如果我将此应用程序托管在web服务器(与其他应用程序共享)的URL上,例如,我在路由方面遇到了问题。有没有办法在相对URL中提及应用程序路径 我尝试对html文件进行更改,使其具有相对URL <link rel="import" href="./src/my-app.html"> <a name="view1" href="./view1">View One</a&g

Polymer 聚合:如何在每个文件的基础上定义常量变量?

我使用的是Polymer 1.0,在我的.js文件中需要一些常量变量。例如: const REQUEST_URL = '/test'; Polymer({ ... // use REQUEST_URL a few times ... }); 这种方法的问题是,如果在不同的文件中多次定义了REQUEST\u URL,它们将发生冲突,并导致SyntaxError:Identifier“REQUEST\u URL”已声明 在Polymer中,以每个文件为基础定义常量变量的首选方法是什么

Polymer 阵列突变时未更新聚合物数据绑定

我注意到Polymer中的模板/数据绑定似乎不能反映数组属性发生变化时的情况(即push())。示例代码如下: [我的元素] myArray:[[JsonString(myArray)]] 推送阵列 集合数组 (功能注册表项(){ 聚合物({ 是‘我的元素’, 特性:{ myArray:{ 类型:数组, 值:函数(){ 返回[]; } } }, pushArray:函数(值){ this.push('myArray',{id:value}); }, setArray:函数(值){ set('m

Polymer Vaadin网格:使用dom repeat时绑定到动态过滤器变量

我正在使用vaadin数据网格和dom repeat模板来创建。我还在网格的页脚中使用过滤器 我需要该过滤器的输入文本字段中的占位符文本,因此我必须设置输入标记。出现问题的部分是值。在Vaadin网格中,这是一个静态命名的变量,等于列名,以\u filter开头,然后附加文本字段的值(::input) 如果我将其硬编码为\u inputHost::input,它将绑定到“host”列的动态生成属性,但仅限于此列。它还会导致排序中断 在下面的示例中,我使用了\u filterXXXXXXX::in

Polymer 聚合物3.0中的去抖器

如何在聚合物3中正确写入去抖动器 据 这很好,但我需要配置一些时间。例如,这就是我在聚合物1中所做的 this.debounce("scroll",function() { this.$$("#scrollThreshold").clearTriggers(); }.bind(this), 400); 和聚合物2 this._debouncer = Polymer.Debouncer.debounce( this._debouncer, // initially u

Polymer 如何判断所有数据绑定何时完成?

假设我有一个聚合元素x-foo,它使用模板进行数据绑定 <template> <!--shadow DOM--> <template repeat='{{item in items}}'> <div class='content'>{{item}}</div> </template> </template> 然后尝试访问阴影DOM内容 this.shadowRoot.querySelecto

Polymer 自动节点查找不工作

我正在尝试运行以下程序(受示例启发)。我想访问loveCount{{post.uid}span元素,并在点击favorite时将其递增1 <post-card favorite="{{post.favorite}}" on-favorite-tap="{{handleFavorite}}" hidden?="{{show == 'favorites' && !post.favorite}}"> <img src="

Polymer 如何在核心列表元素中使用聚合物过滤器

我正在尝试为chrome扩展使用国际化过滤器 i18n:function(string){ return chrome.i18n.getMessage(string); } 这是这样使用的: <paper-tab>{{'SETTINGS'| i18n}}</paper-tab> 它可以正常工作,除非我将模板传递到核心列表中 <core-list id="messagelist" data="{{messageHistory}}"> <

Polymer 聚合:从另一个文件导入和绑定模板

是否可以从另一个文件导入模板?我能够导入javascript和样式表,但不知道如何导入html模板 例如: 我在templates.html中定义了各种内容项模板 <template id="hello>Hello {{ li.name }}</template> <template id="hey">Hey!</template> <link rel="import" href="templates.html"> <poly

Polymer 如何使用没有阴影根的模板?

我希望两个TogglePanel()中的一个可以工作,但它们不能 <template> <core-drawer-panel forceNarrow> </core-drawer-panel> </template> <script> var t = document.querySelector('template'); t.querySelector('core-drawer-panel').togg

Polymer 核心页面中仅呈现一个聚合自定义元素实例

我正在学习如何使用聚合物。我使用聚合物提供的示例应用程序,并尝试逐步扩展它。我面临着核心页面元素的问题。我创建了3页。我的每个页面都包含相同的自定义元素。我经历了一种奇怪的行为。仅呈现自定义元素的最后一个实例。在我的示例中,仅呈现第3页中的一个。如果我删除它,则只呈现第2页中的一页 知道发生了什么以及如何解决这个问题吗 以下是我的页面的源代码: <core-scaffold id="myapp" mode="waterfall"> <div tool flex >

Polymer 1.0扩展元素-带有自定义元素的纸张对话框

我正在尝试创建一个自定义元素,在纸质对话框中播放youtube视频。所以videoPlayer=Polymer.dom(this.root).querySelector('video-player')继承/有权访问该纸张对话框sopen方法,我正在尝试扩展我的自定义元素。这是不工作,但希望我在正确的轨道上,有人可以正确地告诉我 我使用的是Polymer 1.0,但我只需要使用扩展元素 <link rel="import" href="../bower_components/paper-di

Polymer 如何使用铁名单添加联系人搜索,如演示应用程序

我正在尝试实现一个简单的联系人列表。我设置了数据源和该示例中给出的所有内容。现在,如果我想在页面顶部添加一个搜索框或下拉列表,以便用户选择下拉菜单或在搜索框中键入内容,那么如何过滤我的结果。例如:如果用户在搜索框中键入“GRI”,我需要显示名与“GRI”匹配的所有联系人。我该如何实现这一点 假设您这样显示联系人列表: <template is="dom-repeat" items="{{filteredContacts}}" as="contact"> <div>{

Polymer 纸张对话框可滚动,纸张对话框可';我没办法爬上去

我有一段代码,可以按语法滚动一个可滚动的纸质对话框。它正在与以下内容一起工作 this.mypaperscrollable.$.scrollable.scrollTop=someValueHere 现在,由于未解释的原因,$。可滚动的现在只是一个div,没有类似于scrollTop的属性 我试过将paper dialog scrollable作为paper dialog的直接子对象,如果不是直接子对象,我会进行调整。不管怎样都不走运 我用Angular2和聚合物 为什么$.scrollable是

Polymer 纸张对话按钮意外行为

我在做一个项目,设计一个地板灯的布局,如下所示: <style> .big { --iron-icon-height: 200px; --iron-icon-width: 200px; } </style> <template> <paper-button data-dialog="actions" onclick="clickHandler(event)"> <iron-icon c

Polymer 1.5使用不可变数据结构时如何通知dom repeat

问题:我们正在使用redux管理应用程序中的状态。这会导致渲染中出现问题。dom中继器未正确处理数组中的更改(如删除)。发生的情况是,数据和盖章的模板混淆了 我想找到一种方法来通知dom repeat元素数组的更改 <template is="dom-repeat" items="[[data.items]]"> <repeater-item config="[[item]]" on-change="_onChange"></repeater-item>

Polymer “聚合物”之间的确切区别是什么;“反映到属性”;及;通知;?

支持两个不同的键,reflectToAttribute和notify之间的区别我不太清楚 reflectToAttribute表示当值更改时,主机节点上的属性将更改 notify表示该属性可用于双向绑定 这不是一回事吗?如果将notify设置为true,那么您是否仍需要reflect属性 有人能给我解释一下这些钥匙是如何相互关联的吗?谢谢 reflectToAttribute是将属性添加到DOM中。例如,通过这种方式,您可以将其用作CSS中的选择器 notify是您问题中提到的双向绑定 这是两个

Polymer 如何使用箭头键导航铁选择器项目?

如何使用箭头键导航铁选择器项目 <template is="dom-repeat" items="[[icons]]"> <iron-icon icon="[[item.name]]"/> </template> 您需要使用iron-a11y键和数组的组合来跟踪铁选择器项目的顺序。iron-a11y-keys允许在按下特定键时执行javascript方法,然后在该方法中,您需要确定要转换到哪个ir

Polymer 聚合物2.0中的内部链接

在Polymer 2.0中实现内部链接(在同一页面内链接)的正确方法是什么?我似乎无法访问隐藏在shadowdom中的组件,因此使用和 我尝试过的以下代码都返回null,即使在我向组件添加id时也是如此: document.querySelector('#my_section'); //null this.$.my_section; //null this.root.querySelector('#my_section'); //null this.shadowRoot.querySele

Polymer 铁选择器/应用程序路径:奇怪的行为

我面临的问题是,我的应用程序中的路由无法正常工作。。。为了更好的可读性,我省略了一些目前不必要的代码,并重命名了我的元素。让我们先看一下代码,然后我将解决这个问题: my-custom-frame.html 现在问题来了: 当用户进入页面时,他会被重定向到#/home(我在我的自定义框架中有一个观察者,它观察路由,并设置路由。路径到主页,如果它是空的-我在铁选择器中也有备用项): my-custom-frame.html 目前一切正常。如果用户现在单击子页面-图标,他将被重定向到#/subpag

从Polymer CLI启动测试时,如何指定Sauce Labs应使用哪些浏览器?

我有一个Polymer v1.7 element only项目 我已经和特拉维斯CI和酱汁实验室建立了它,效果很好 但是,我希望能够通过Sauce实验室在特定浏览器中启动测试,而不必每次都修改wct.conf.json文件 Polymer CLI的帮助输出显示,您可以使用-sauce标志指定浏览器,但不会告诉您需要什么格式: -s、 -要在其上运行测试的酱字符串远程酱实验室浏览器,或“默认” 有人能告诉我如何指定浏览器吗?我想我需要告诉它我需要什么平台、浏览器和版本,只是不知道怎么做 可能不是你

Polymer 更改纸张切换按钮的大小

我是高分子方面的新手 我在我的项目中添加了纸张切换按钮。我在官方网站上找到了css类来改变颜色和过渡动画。然而,我想减少它的大小,特别是一些像素 我在网上搜索过。但没有成功 请帮助您可以通过应用mixin更改大小,将以下代码添加到css样式中 paper-toggle-button { --paper-toggle-button-unchecked-button: { width: 30px; height: 30px; } --paper

Polymer 聚合物2:聚合物构建-错误

我在polymer 2中完成了我的项目,我试图执行“polymer build”命令,但它返回我以下错误:承诺拒绝:错误:enoint:没有这样的文件或目录,打开“/Users/tech387/Desktop/Wobbl/Wobbl Frontend Admin Console/bower_components/bower_components/polymer/polymer element.html” 它似乎试图在错误的目录中找到我的聚合元素,因为我的聚合元素位于以下路径:“/Users/te

Polymer 如何将数据推送到dom repeat

我试图将数据推送到历史数组中,该数组将在dom repeat模板中更新 模板 <paper-button on-tap="_addToHistory">Add to History</paper-button> <template is="dom-repeat" items="{{history}}"> <h3 class="test">[[item.name]]</h3> </template> 功能 histor

上一页   1   2   3    4   5   6  ... 下一页 最后一页 共 57 页