试图使用自定义元素,“您尝试使用聚合物而不加载它”,它肯定是导入的 [英] Trying to use custom element, "You tried to use polymer without loading it first", it's definitely imported

查看:90
本文介绍了试图使用自定义元素,“您尝试使用聚合物而不加载它”,它肯定是导入的的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我一直在尝试使用自定义元素来创建我想要使用的纸质对话框弹出窗口。如果我在自定义元素的文件中设置了一个测试页,使用与我的索引相同的导入,它就可以工作。如果我将自定义元素导入任何其他页面,则不再有效。即使我加载了可以在另一个页面上工作的测试文件,它也给我提供了错误未捕获错误:您尝试使用聚合物时未先加载它。要加载聚合物,< link rel =importhref =components / polymer / polymer.html>



我的自定义元素文件中的 polymer.html 导入。即使我使用自定义元素并将其定义在我的索引中,与外部测试完全相同的代码,它也会返回此错误。我不明白为什么和我已经广泛搜索。有人知道为什么吗?



以下是我的自定义元素的代码:

 < polymer-element name =share-dialogattributes =pageid,post> 
< template>
<纸对话背景autoCloseDisabled id =叠加transition =纸对话转换底标题=分享>
长按,高亮显示并复制:< br>
< center>< paper-input id ='share_box'type ='text'name ='share'value ='xxxxx / index.php?page = news& id = {{pageid}}&交= {{交}}'>< /纸张输入>< /中心],[<峰; br>
< center>
< paper-button core-overlay-toggle raised>关闭< / paper-button>
< / center>
< / paper-dialog>
< / template>
< script>

Polymer('share-dialog',{
toggle:function(){
this。$。overlay.toggle();
}
});

< / script>
< / polymer-element>

很明显,我在该输入框中使用了一个实际的网址,只是为了我编辑的隐私

这些是我的进口:

 <脚本SRC = bower_components / webcomponentsjs / webcomponents.js >< /脚本> 
< link rel =importhref =bower_components / polymer / polymer.js>

< link rel =importhref =bower_components / polymer / polymer.html>
< link rel =importhref =bower_components / core-icons / core-icons.html>
< link rel =importhref =bower_components / core-icons / social-icons.html>
< link rel =importhref =bower_components / paper-spinner / paper-spinner.html>
< link rel =importhref =bower_components / core-toolbar / core-toolbar.html>
< link rel =importhref =bower_components / core-animated-pages / core-animated-pages.html>
< link rel =importhref =bower_components / core-animated-pages / transitions / slide-from-right.html>
< link rel =importhref =bower_components / core-menu / core-menu.html>
< link rel =importhref =bower_components / core-drawer-panel / core-drawer-panel.html>
< link rel =importhref =bower_components / core-header-panel / core-header-panel.html>
< link rel =importhref =bower_components / core-item / core-item.html>
< link rel =importhref =bower_components / core-style / core-style.html>
< link rel =importhref =bower_components / font-roboto / roboto.html>
< link rel =importhref =bower_components / paper-button / paper-button.html>
< link rel =importhref =bower_components / paper-checkbox / paper-checkbox.html>
< link rel =importhref =bower_components / paper-icon-button / paper-icon-button.html>
< link rel =importhref =bower_components / paper-fab / paper-fab.html>
< link rel =importhref =bower_components / paper-tabs / paper-tabs.html>
< link rel =importhref =bower_components / paper-toast / paper-toast.html>
< link rel =importhref =bower_components / paper-progress / paper-progress.html>
< link rel =importhref =bower_components / core-transition / core-transition.html>
< link rel =importhref =bower_components / paper-dialog / paper-dialog.html>
< link rel =importhref =bower_components / paper-dialog / paper-dialog-transition.html>
< link rel =importhref =bower_components / paper-dialog / paper-dialog-base.html>
< link rel =importhref =bower_components / paper-elements / paper-elements.html>
< link rel =importhref =bower_components / core-overlay / core-overlay.html>

直到我尝试调用< share-dialog>时才抛出错误。 < / share dialog>

解决方案

js 和 polymer.html 。您应该只包含 polymer.html


I've been trying to use a custom element for a paper-dialog popup that I want to use. If I set up a test page within the file the custom element is defined in, using all the same imports as my index, it works. If I import the custom element into any other page, it no longer works. Even if I load the test file that does work into a div on another page, it gives me the error Uncaught Error: You tried to use polymer without loading it first. To load polymer, <link rel="import" href="components/polymer/polymer.html">

I definitely have the polymer.html import in my custom element file. Even if I take the custom element and define it in my index, exactly the same code from the external test, it returns this error. I don't understand why and I've searched extensively. Does anyone know why?

Here's the code for my custom element:

    <polymer-element name="share-dialog" attributes="pageid, post">
<template>
    <paper-dialog backdrop autoCloseDisabled id="overlay" transition="paper-dialog-transition-bottom" heading="Share">
        Long-press, highlight and copy: <br>
        <center><paper-input id='share_box'type='text' name='share' value='xxxxx/index.php?page=news&id={{pageid}}&post={{post}}'></paper-input></center><br>
        <center>
            <paper-button core-overlay-toggle raised>Close</paper-button>
        </center>
    </paper-dialog>
</template>
<script>

Polymer('share-dialog', {
    toggle: function() {
        this.$.overlay.toggle();
    }
});

</script>
</polymer-element>

Obviously I use an actual url in that input box, just for the sake of privacy I've edited that out.

These are my imports:

    <script src="bower_components/webcomponentsjs/webcomponents.js"></script>
<link rel="import" href="bower_components/polymer/polymer.js">

<link rel="import" href="bower_components/polymer/polymer.html">
<link rel="import" href="bower_components/core-icons/core-icons.html">
<link rel="import" href="bower_components/core-icons/social-icons.html">
<link rel="import" href="bower_components/paper-spinner/paper-spinner.html">
<link rel="import" href="bower_components/core-toolbar/core-toolbar.html">
<link rel="import" href="bower_components/core-animated-pages/core-animated-pages.html">
<link rel="import" href="bower_components/core-animated-pages/transitions/slide-from-right.html">
<link rel="import" href="bower_components/core-menu/core-menu.html">
<link rel="import" href="bower_components/core-drawer-panel/core-drawer-panel.html">
<link rel="import" href="bower_components/core-header-panel/core-header-panel.html">
<link rel="import" href="bower_components/core-item/core-item.html">
<link rel="import" href="bower_components/core-style/core-style.html">
<link rel="import" href="bower_components/font-roboto/roboto.html">
<link rel="import" href="bower_components/paper-button/paper-button.html">
<link rel="import" href="bower_components/paper-checkbox/paper-checkbox.html">
<link rel="import" href="bower_components/paper-icon-button/paper-icon-button.html">
<link rel="import" href="bower_components/paper-fab/paper-fab.html">
<link rel="import" href="bower_components/paper-tabs/paper-tabs.html">
<link rel="import" href="bower_components/paper-toast/paper-toast.html">
<link rel="import" href="bower_components/paper-progress/paper-progress.html">
<link rel="import" href="bower_components/core-transition/core-transition.html">
<link rel="import" href="bower_components/paper-dialog/paper-dialog.html">
<link rel="import" href="bower_components/paper-dialog/paper-dialog-transition.html">
<link rel="import" href="bower_components/paper-dialog/paper-dialog-base.html">
<link rel="import" href="bower_components/paper-elements/paper-elements.html">
<link rel="import" href="bower_components/core-overlay/core-overlay.html">

No error is thrown until I try to call <share-dialog></share dialog>

解决方案

You're including polymer.js and polymer.html. You should only include polymer.html.

这篇关于试图使用自定义元素,“您尝试使用聚合物而不加载它”,它肯定是导入的的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆