Question

我正在开发一个用于支持辅助功能的构建块元素a11y-icon。当用户按下该图标上的某个键时，此自定义元素应提供键盘事件处理程序。

<dom-module id="a11y-icon">
    <template>
        <iron-icon icon="{{icon}}" style="{{style}}" tabindex="0" role="button" aria-label$="{{description}}" on-keypress="_keyPressHandler"></iron-icon>
    </template>
</dom-module>
<script>
    Polymer({
        is: "a11y-icon",
        properties: {
            icon: String,
            style: String,
            description: String
        },
        _keyPressHandler: function(event) {
            var code = event.keyCode;
            // accept enter or spacebar key
            if (code == 13 || code == 32) {
                // TODO: call on-tap handler defined in element which uses a11y-icon
            }
        }
    });
</script>

当开发人员使用a11y-icon元素并提供一个on-tap处理程序时，我想要一个_11y-icon _keyPressHandler来调用该on-tap处理程序。

<a11y-icon class="clickable" icon="icons:close" description="close this item" on-tap="_closeItem">

我的问题是如何从主机元素处理程序（例如_keyPressHandler）调用元素on-tap处理程序（例如_closeItem）？我假设聚合物使用内部数据绑定在某处存储点击处理程序。

Answer 1

通过浏览Polymer.html，我终于找到了一种在keypress处理程序中调用on-tap处理程序的方法 -

    _keyPressHandler: function(event) {
        var code = event.keyCode;
        // accept enter or spacebar key
        if (code == 13 || code == 32) {
            this.fire("tap", event.currentTarget, event);
        }
    }

从host元素on-keypress处理程序访问元素on-tap处理程序

1 个答案: