如何使javascript代码在聚合自定义元素中工作

我使用的是聚合物起动器套件2.0

嵌套自定义元素的结构： （意味着

在index.html等中）：

|index.html
--------\我的app.html（自定义元素）
----------------\my-testView1.html（自定义元素）
----------------\my-testView2.html（自定义元素）

我需要在my-testView1.html和my-testView2.html页面上放置disqs注释（每个页面有单独的线程）

我试着让它工作，chrome的控制台消息告诉我必须使用ajax方法（因为my-testView1.html和my-testView2.html都在

中，所以路由正在进行，我想这就是原因），它也给了我这个链接

my-testView1.html的结构

：
（我将example.com和myChannelID改为实名）

这里早些时候曾有人问过我这个问题：
在那里的帮助和指导下，我成功地达到了这一点。但我仍然不能让它与ajax一起工作，这样它就可以将单独的disks线程加载到每个页面

也许这与

#有关

或者可能我必须将它插入

ready:function（）{}

中，但如果我这样做，它会破坏布局，因此我将它放在一个单独的标记中，现在它说

discus未定义

。我不知道我错过了什么

我只有50个声誉奖励要分享，但如果你知道如何使它工作，请你解释我如何修复它。

页面中的

元素必须是唯一的，因为它是Discus库安装下载线程的地方。因此，您应该将其添加到

标记之后

<div>
  <iron-pages>
    <view-1></view-1>
    <view-2></view-2>
  </iron-page‌​s>
</div>
<div id="disqus_thread"></div>

---

另外，由于使用了

discus.reset（）

，因此可以删除

var discus\u config=…

---

要解决

元素的唯一性问题，请执行以下操作：

如果要将其插入到内部的右侧页面中，可以在调用

discus.reset（）

之前使用

appendChild（）

移动它。例如，将其放在

元素中

内部

attributeChange（）

方法：

在

视图-1中

：

//页面内容
//页脚

另一种可能的解决方案是： 创建一个html文件，并将DISKS代码放入其中：

<div id="disqus_thread"></div>
<script>
    var disqus_shortname = 'YourDisqusId';
    var disqus_identifier = '/view1';
    var disqus_url = 'https://example.com/view1/';
    var disqus_config = function () {

    };
    (function() {
        var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
        dsq.src = 'https://' + disqus_shortname + '.disqus.com/embed.js';
        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
     })();

</script>

var discus_shortname='yourDiscussid'；
var discus_标识符='/view1'；
var discus_url='1〕https://example.com/view1/';
var discus_config=函数（）{
};
（功能（）{
var dsq=document.createElement（'script'）；dsq.type='text/javascript'；dsq.async=true；
dsq.src='https://'+discus_shortname+'.discus.com/embed.js'；
（document.getElementsByTagName（'head'）[0]| | document.getElementsByTagName（'body'）[0]）.appendChild（dsq）；
})();

然后向链接该代码的自定义元素页面添加iframe

 <iframe src="../src/page1_disqus.html" style="width:100%; min-height:400px; border:0 none;"></iframe>

如果它只是在这个iframe中向您显示您的应用程序，那么最好不要将这个html文件放在您的src目录中，而是放在一个单独的服务器上，并使用共享链接而不是本地存储

。/src/

---

如果您需要在多个页面上放置discus，只需创建另一个html文件，然后以相同的方式将其链接到需要使用iframe的页面

谢谢。好的，但是如果要在放置

的位置插入一个线程，那么如果我将它放在

下的

我的app.html

上，它就不会出现在页面上。现在这个div通过

到达了它需要的位置，那么如果我把它放在铁皮书页下面，它会出现在什么地方呢？我用一个解决方案更新了ma答案，它没有利用感谢你的帮助，伙计，声誉赏金是你的

Polymer( {
    is: 'view-1',
    attributeChanged: function ( name, old, value )
    {
        if ( name == 'class' && this.classList.contains( 'iron-selected' ) )
        {   
            //call DISQUS.reset() here
            DISQUS.reset( {
                reload: true,
                config: function () 
                {
                    this.page.identifier = "/testView1"
                    this.page.url = "https://www.example.com/testView1"
                }
            } )
        }
    }
} ) 

this.$.container.appendChild( document.getElementById( 'disqus_thread' ) )

<template>
  //Page content
  <div id=container></div>
  //Page footer
</template>

<div id="disqus_thread"></div>
<script>
    var disqus_shortname = 'YourDisqusId';
    var disqus_identifier = '/view1';
    var disqus_url = 'https://example.com/view1/';
    var disqus_config = function () {

    };
    (function() {
        var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
        dsq.src = 'https://' + disqus_shortname + '.disqus.com/embed.js';
        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
     })();

</script>

 <iframe src="../src/page1_disqus.html" style="width:100%; min-height:400px; border:0 none;"></iframe>