小编Isk*_*lla的帖子

Polymer 1.0上的条件模板

我认为,我在应用新条件模板时遇到了麻烦,尤其是条件本身.

我有这样的事情:

<template is="dom-repeat" items="{{menuitems}}" as="poscol">
    <template is="dom-if" if="{{index != 4}}">
        <div class="positioncolum horizontal layout center wrap flex">
            <span>{{index}}</span>
            <template is="dom-repeat" items="{{poscol}}" as="mitem" >
               <main-menu-item mitem="{{mitem}}"
                   order="{{mitem.TotalOrder}}"
                   onclick="clickMainMenuMod(index)">
               </main-menu-item>
            </template>
       </div>
   </template>
</template>
Run Code Online (Sandbox Code Playgroud)

现在,如果我评论该<template is="dom-if" if="{{index != 4}}">位它工作正常,索引显示它应该.在第四个阵列上存储了用户选择为不可见的模块,因此它们不应出现在主菜单上.

我想if条件有问题,但我不知道是什么.

谢谢!

polymer polymer-1.0

5
推荐指数
1
解决办法
7919
查看次数

相同聚合物元素的多个实例导致所有这些实例的行为

我有这个简单的元素,它允许您一次选择一个本地文件,然后将所选文件显示为您可以删除的项目,如下所示: 在此输入图像描述

组件本身工作得很好,问题是我在同一页面中有另一个相同类型的组件,但在不同的父元素(和隐藏)内.如果我在第一个文件选择器上选择n个文件,然后切换到查看另一个父组件,第二个文件选择器会在其中显示在第一个文件选择器上选择的相同文件.

如果我将两个这样的文件组件放在同一个父元素中,在其中一个文件中选择一个文件并不会在另一个文件中显示相同的文件,但从其中任何文件中删除文件会使组件文件成为数组属性(我在哪里)将所选的每个文件都存储得更短),最终导致无法从其中一个中删除项目.

我认为我的问题与某种方式的封装有关,但无法弄清楚原因.这是我组件的代码:

<dom-module id="custom-file-input">
<style>
    ...
</style>
<template>
    <div class="horizontal layout flex relative">
        <button class="action" on-click="butclick" disabled$="{{disab}}">{{restexts.CHOOSEFILE}}</button>
        <div id="fakeinput" class="flex">
            <template is="dom-repeat" items="{{files}}" as="file">
                <div class="fileitem horizontal layout center">
                    <span>{{file.0}}</span><iron-icon icon="close" class="clickable" on-click="removeFile"></iron-icon>
                </div>
            </template>
        </div>
        <input id="fileinput" type="file" on-change="fileChanged" hidden />
    </div>
</template>
<script>
    Polymer({
        is: "custom-file-input",
        properties: {
            files: {
                type: Array,
                value: []
            },
            currentFile: {
                type: Object,
                value: {}
            },
            disab: {
                type: Boolean,
                value: false,
                reflectToAttribute: true,
                notify: true
            },
            restexts: {
                type: …
Run Code Online (Sandbox Code Playgroud)

polymer polymer-1.0

5
推荐指数
1
解决办法
1041
查看次数

防止聚合物将子元素类设置为样式范围

我在迁移到Polymer 1.0时遇到了一些麻烦

我的主要问题是类"style-scope"和"my-element"正在应用于元素中的每个子节点.使用这样的东西时这不是问题:

<paper-dialog modal class="vertical layout">
    <div class="top">
        <div class="green">{{format(inputtext)}}</div>
Run Code Online (Sandbox Code Playgroud)

它只是将它们的类分别改为"top style-scope my-element"和"green style-scope my-element",一切正常.

但是现在在Polymer 1.0上我无法将类名绑定到属性,因此我必须使用以下内容计算它:

<template is="dom-repeat" items="{{ item-list }}" as="item">
     <span class="{{setitemclass(item)}}" on-click="itemClicked" role="button" >{{item}}</span>
</template>

setitemclass: function (item) {
     return 'itnumb' + item;
}
Run Code Online (Sandbox Code Playgroud)

创建元素时,创建的每个span都会通过setitemclass函数返回它应该返回的内容(类似'itnumb1','itnumb2'等等),但是当它完成时,该类显示为"style-scope my-element" "对于每一个跨度,没有叹息'itnumb#'位于任何地方.

我只是不知道如何处理这个,因为绑定在我眼中已经发生了很大变化.

谢谢!

polymer polymer-1.0

4
推荐指数
1
解决办法
993
查看次数

标签 统计

polymer ×3

polymer-1.0 ×3