2015-02-25 2 views
0

Я сталкивался с этой ситуацией много раз раньше, и я до сих пор не могу это исправить. Когда я импортирую элементы ядра/бумаги, загруженные из беседки, импорт будет предотвращать загрузку моей страницы, поэтому я получаю пустой экран. Мне удалось исправить эту проблему, импортировав url в элемент вместо bower. Я смог создать простой полимерный элемент, состоящий из множества входных текстов, но сегодня, когда я создал простой элемент привязки данных, моя страница не будет загружаться.Импорт полимеров не производится

index.html

<!DOCTYPE html> 
<html> 
<head> 
    <link rel="import" href="http://www.polymer-project.org/components/polymer/polymer.html"> 
    <link rel="import" href="hello-name.html"> 
    <script src="https://www.polymer-project.org/components/webcomponentsjs/webcomponents.js"></script> 
</head> 
<body> 
    <p><hello-name></hello-name><p> 
</body> 
</html> 

привет-name.html

<polymer-element name="hello-name"> 
    <template> 
     <h1>Hello {{name}}</h1> 
     <input type="text" value="{{name}}> 
    </template> 
    <script> 
     Polymer('hello-name', { 
      ready: function() { 
       this.name = "World"; 
      } 
     }) 
    </script> 
</polymer-element> 
+0

Изменить на ''. [Вот плункер] (http://plnkr.co/edit/u9bZK6JG9E2uBHj57SEU?p=preview), все, кажется, работает просто отлично – wirlez

ответ

2

Один потенциальный вопрос, который я могу видеть, что вы хотите поставить webcomponents.js выше Вашего импорта.

Другая распространенная причина пустого экрана - это когда у вас есть некоторые элементы с объявлениями html, но нет соответствующего сценария, что создает ситуацию, когда Polymer ожидает, что их сценарий будет загружен и исполнен. Вы можете увидеть, какие элементы Polymer ждут, запустив Polymer.waitingFor() в консоли вашего браузера.

+0

Есть ли замена для 'Polymer.waitingFor()' in polymer 1.7+ - I сталкиваются с проблемой simionar и не знают, как отладить это. В основном моя страница перенаправления 404 отображается только правильно, если я не импортирую в нее бумагу/бумажный материал ... – Nicolas

0

Вам не нужно Polymer.html на главной странице html, которую вы должны включить в свой пользовательский элемент.

<link rel="import" href="http://www.polymer-project.org/components/polymer/polymer.html"> 

<polymer-element name="hello-name"> 
    <template> 
     <h1>Hello {{name}}</h1> 
     <input type="text" value="{{name}}> 
    </template> 
    <script> 
     Polymer('hello-name', { 
      ready: function() { 
       this.name = "World"; 
      } 
     }) 
    </script> 
</polymer-element> 
0

Я импортировал пользовательский элемент, который я создал несколько месяцев назад, и, похоже, у него нет проблем. Я только что создал еще один простой элемент с привязкой и, похоже, сломал страницу тоже! Я попытался поместить template.html в начало пользовательского элемента, а также переместить webcomponent.js на вершину импорта и, похоже, не работает.

0

Структура каталогов важна. Предположим, что у вас есть;

/bower_components/polymer/polymer.html 

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

/bower_components/hello/hello.html 

Внутри Hello.html нагрузки polymer.html

<link rel="import" href="../polymer/polymer.html"> 

HREF используется для идентификации, если элемент загружается ранее. Если вы не используете браузер ./polymer/polymer.html, он пытается загрузить его дважды, и вы получите пустую страницу.

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