폴리머 및 종이 요소에 초보자가 있습니다. 난 그냥 새로운 빈 폴리머 응용 프로그램을 만들고 종이 요소에서 몇 가지 예제를 실행하려고합니다.일부 종이 요소 예제로 폴리머 앱을 작성하는 방법
this을 사용하여 빈 폴리머 앱을 만들었습니다. 는 그럼 이물 사용하여 종이 요소를 추가 - 내가 붙여 복사 다음 bower install --save PolymerElements/paper-elements
을 code이 :
<link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="/bower_components/paper-button/paper-button.html" >
<link rel="import" href="/bower_components/paper-input/paper-input.html" >
<link rel="import" href="/bower_components/iron-icons/iron-icons.html" >
<dom-module id="allegro-combo-box">
<template>
<style>
:host {
display: block;
}
paper-input {
max-width: 400px;
margin: auto;
}
iron-icon, div[suffix] {
color: hsl(0, 0%, 50%);
margin-right: 12px;
}
</style>
<h2>Hello [[prop1]]!</h2>
<paper-input always-float-label label="Floating label"></paper-input>
<paper-input label="username">
<iron-icon icon="mail" prefix></iron-icon>
<div suffix>@email.com</div>
</paper-input>
</template>
<script>
/** @polymerElement */
class Mextends Polymer.Element {
static get is() { return 'my-element'; }
static get properties() {
return {
prop1: {
type: String,
value: 'my-element'
}
};
}
}
window.customElements.define(MyElement.is, MyElement);
</script>
</dom-module>
는 불행하게도이 코드는
을 수상 :<paper-input always-float-label label="Floating label"></paper-input>
<paper-input label="username">
<iron-icon icon="mail" prefix></iron-icon>
<div suffix>@email.com</div>
</paper-input>
그래서 내 모든 element.html은 다음과 같습니다 일하지 마라. <h2>Hello [[prop1]]!</h2>
만 작동하며 용지의 요소는 작동하지 않습니다.
문제를 해결하는 방법은 무엇입니까? "async"를 가져 오기에 추가하려고 시도했지만 도움이되지 않습니다.
도와주세요.
이
콘솔에 일부 오류가 있습니다 용지 요소가 올바른 경로가없는 대한Uncaught DOMException: Failed to execute 'define' on 'CustomElementRegistry': this name has already been used with this registry
Uncaught TypeError: Cannot read property 'nativeMethods' of undefined
경로가 올바른지 –
그러면 Polymer 요소의 경로가 잘못되었을 수 있습니다. 아니면 두 개의 bower_components 디렉토리가 있습니까? –
폴리머 요소에 대한 경로가 좋고 하나의 디렉토리 만 있습니다 –