Question

在下面的代码中，我想使用一个函数作为条件属性：

<polymer-element name="test-element">
    <template>
        <select id="type_menu" on-change="{{ onSelected }}">
            <option value="0" disabled?="{{ isDisabled }}">Item 0</option>
            <option value="0" disabled?="{{ isDisabled }}">Item 1</option>
            <option value="0" disabled?="{{ isDisabled }}">Item 2</option>
        </select>
    </template>
    <script>
        Polymer('test-element', {
            onSelected: function(event, details, sender) {
                // do something here
            },
            isDisabled: function() {
                return false; // simplified here - it doesn't matter, it always returns true
            }
        }
    </script>
</polymer-element>

到目前为止，我还没能完成这项工作。我曾尝试使用禁用？=＆＃34; {{isDisabled（）}}＆＃34;也。它可以完成吗？如果没有，用某种功能做到这一点的最佳方法是什么？在就绪时设置数据属性可能会有效但看起来有点笨拙。

Answer 1

这是我如何解决它的一个例子：

<polymer-element name="test-element">
<template>
    <select id="type_menu" on-change="{{ onSelected }}">
        <option value="0" disabled?="{{ someData[0].val | isDisabled }}">Item 0</option>
        <option value="1" disabled?="{{ someData[1].val | isDisabled }}">Item 1</option>
        <option value="2" disabled?="{{ someData[2].val | isDisabled }}">Item 2</option>
    </select>
</template>
<script>
    Polymer('test-element', {
        ready: function() {
            // in this case, I'm just using read to put in some simple values to filter
            this.someData = [{
                    val = 0
                },{
                    val = 1
                },{
                    val = 2
             }];
        },
        onSelected: function(event, details, sender) {
            // do something here
        },
        isDisabled: function(val) {
            return val < 2;
        }
    }
</script>
</polymer-element>

这是一个非常简单的例子，但要点是：

条件属性绑定（禁用？= {{}}）需要一个值（{{value}}）或一个值和一个由管道分隔的过滤器（{{value | filter}}）。如果你给它一个函数作为值，我相信它直接评估函数的真实性（不运行它） - 即someFunctionName == true而不是someFunctionName（）== true。在该上下文中，someFunctionName将始终是真实的，因为它评估函数的存在（未定义或不为null等），而不是函数可能返回的值。

在修复中，我使用了一个过滤器，它被评估为函数返回（并传递了值）。如果在此处显示的修复程序中，我只是包含该值，则第一个选项将被禁用，其他选项将被启用（因为0为false）。但是，如果我将过滤器传递给过滤器，则该函数可以根据其算法评估该值。

当您使用带有循环的内部模板根据数据填充某些列表并且您想要动态设置禁用，选择（等等）时，这非常有用。

我可以将函数用作条件属性

1 个答案: