Комментарии Disqus не работают в пользовательском элементе из полимера
Я не знаю, как сделать код комментариев disqus для работы внутри моих пользовательских элементов.
Структура моего сайта:| index.html
-------- \
(пользовательский элемент)my-app.html
---------------- \
(пользовательский элемент)
---------------- \
(пользовательский элемент)my-testView1.html
Мне нужно поместить комментарии disqus внутри
а такжеmy-testView2.html
Структура
Структураmy-testView1.html
Структураmy-testView2.html
index.html
: <body>
<my-app>
<div class="disqusClass1" id="disqus_thread"></div>
<div class="disqusClass2" id="disqus_thread"></div>
<my-app>
</body>
Дискуссияmy-app.html
: <iron-pages>
<my-testView1 name="testView"><content select=".disqusClass1"></content></my-testView1>
<my-testView2 name="testView2"><content select=".disqusClass2"></content></div></my-testView2>
</iron-pages>
Я поместил div комментариев disqus внутриmy-testView1.html
:<template>
<content select=".disqusClass1"></content>
</template>
наmy-testView2.html
:<template>
<content select=".disqusClass2"></content>
</template>
чтобы хром мог его найти. Этоне может<my-app>
найди это если я положу это внутрьindex.html
как это:страницапотому что my-app.html сам по себе является пользовательским элементом, и Chrome не сможет его найти. Так что я должен был положить его за пределы теневого дома (<my-testView1>
страница)
Код Javacript на страницахmy-app.html
<iron-pages>
<my-testView1 name="testView"><div id="disqus_thread"></div></my-testView1>
<my-testView2 name="testView2"><div id="disqus_thread"></div></my-testView2>
</iron-pages>
а такжеindex.html
выглядеть так:
my-testView1.html
Комментарии появляются только на одном из этихmy-testView2.html
в это время. Мне нужна 1 дискуссия<dom-module id="my-testView1">
<template>
...
<content></content>
...
</template>
<script>
Polymer({
is: 'my-testView1',
ready: function ()
{
// DEFAULT DISQUS CODE (I changed real URLs though):
var disqus_config = function () {
this.page.url = 'https://www.example.com/testView1'; // Replace PAGE_URL with your page's canonical URL variable
this.page.identifier = '/testView1';
// this.page.title = 'Test View';
};
(function() {
var d = document, s = d.createElement('script');
s.src = '//myChannelName.disqus.com/embed.js';
s.setAttribute('data-timestamp', +new Date());
(d.head || d.body).appendChild(s);
})();
}
});
</script>
</dom-module>
мой-testView1.html и еще одна дискуссия на темуmy-testView1.html
my-testView2.html
мой-testView2.htmlМожет быть, это из-за маршрутизации. Сообщение консоли Disqus говорит, что мне нужно использовать метод ajaxhttps://help.disqus.com/customer/portal/articles/472107-using-disqus-on-ajax-sites К сожалению, я не смог заставить его работать, когда я заменил код javascript выше на код из примера:
внутри обоих пользовательских элементов (изменение а также соответственно для каждого из них)
<script>
Polymer({
is: 'my-testView1',
ready: function ()
{
var disqus_shortname = 'myDisqusChannelId';
var disqus_identifier = '/testView1';
var disqus_url = 'http://example.com/testView1';
var disqus_config = function () {
this.language = "en";
};
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = 'http://' + disqus_shortname + '.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
var reset = function (newIdentifier, newUrl) {
DISQUS.reset({
reload: true,
config: function () {
this.page.identifier = newIdentifier;
this.page.url = newUrl;
}
});
};
}
});
</script>
</dom-module>
Вам, вероятно, не обязательно помещать скрипт Disqus в основной документ. Посмотрите, как я поместил его в шаблон элемента и связатьdisqus_identifier
имущество:disqus_url
jsbin.com/feqaqig/edit?html,js,output