Как использовать полимерный элемент внутри другого полимерного элемента

Я пытаюсь сделать вложенные полимерные элементы. Редактор не показывает ошибок или предупреждений.Как использовать полимерный элемент внутри другого полимерного элемента

componentone.html

<link rel="import" href="componenttwo.html"> 

<polymer-element name="component-one" noscript> 
    <template> 
     <h1>Parent element</h1> 
     <component-two></component-two> 
    </template> 
</polymer-element>

componenttwo.html

<polymer-element name="component-two" noscript> 
    <template> 
    <h2>Nested element</h2> 
    </template> 
</polymer-element>

testcomponents.html

<html> 
    <head> 
     <link rel="import" href="componentone.html"> 
     <script src="packages/polymer/boot.js"></script> 
     <script src="packages/browser/interop.js"></script> 
    </head> 

    <body> 
     <component-one></component-one> 

     <script type="application/dart" src="testcomponents.dart"></script> 
    </body> 
</html>

Когда я бегу testcomponents.html ничего не отображается в браузере, но в консоль редактора Там это ошибка

Invalid CSS property name: -webkit-touch-callout 
Exception: Stack Overflow 
    runMicrotask (package:observe/src/microtask.dart:63:45) 
    initPolymer (package:polymer/src/loader.dart:32:15) 
    main (http://127.0.0.1:3030/jukudart2/web/testcomponents.html:5:22) 
    registerCustomElement (package:custom_element/custom_element.dart:62:25) 
    initPolymer.<anonymous closure> (package:polymer/src/loader.dart:39:26) 
    runMicrotask.<anonymous closure> (package:observe/src/microtask.dart:65:16)

источник

2013-10-14 Juri Krainjukov

В componentone.html попробуйте поставить ссылку внутри полимерного теге элемента, но перед тегом шаблона. (Извините за мою краткость, на мобильном телефоне)

источник

2013-10-14 17:35:34

Я попытался это и получить ту же ошибку –

Я попробовал ваш пример и получил ту же ошибку.

Он работал, когда я добавил файл дротика для обоих компонентов и указан CustomTag аннотацию:

componentone.html

<link rel="import" href="componenttwo.html"> 

<polymer-element name="component-one"> 
    <template> 
     <h1>Parent element</h1> 
     <component-two></component-two> 
    </template> 

    <script type="application/dart" src="componentone.dart"></script> 
</polymer-element>

componentone.dart

import 'package:polymer/polymer.dart'; 

@CustomTag("component-one") 
class ComponentOne extends PolymerElement { 
}

componenttwo.html

<polymer-element name="component-two"> 
    <template> 
    <h2>Nested element</h2> 
    </template> 
    <script type="application/dart" src="componenttwo.dart"></script> 
</polymer-element>

componenttwo.dart

import 'package:polymer/polymer.dart'; 

@CustomTag("component-two") 
class ComponentTwo extends PolymerElement { 
}

источник

2013-10-14 21:07:53

Great! Это работает. Таким образом, является ли эта невозможность встраивания элементов noscript ошибкой или она предназначена для этого? Кстати, я не нашел ни одного учебника/примеров компонентов, содержащих другие компоненты в любом месте. Это может быть очень полезно. –

Это определенно было бы ошибкой и не предназначалось. Напечатайте ошибку на http://dartbug.com/new –

Теперь вы можете найти примеры некоторых довольно сложных политик компонента «Полимер Дарт» в Spark IDE (https://github.com/dart-lang/spark), который является открытым исходный проект, возглавляемый Google. –

Как использовать полимерный элемент внутри другого полимерного элемента

ответ

Смежные вопросы