聚合物进口动态HTML

我有产品上市的移动应用程序中使用Polymer聚合物进口动态HTML

工作，所以我想加载产品细节，如3幅图像能解密，当点击缩略图，

我其他细节中号使用core-animated-pages，以显示产品的缩略图和详细视图

这里是HTML

<div id="article-content" > 
<template is="auto-binding" id="page-template" > 
<core-ajax 
    id="ajaxpolo" auto 
    url="./json/products.json" 
    handleAs="json" 
    response="{{productList}}"> 
    </core-ajax> 
<core-animated-pages id="fpages" flex selected="{{$.polo_cards.selected}}" on-core-animated-pages-transition-end="{{transitionend}}" transitions="cross-fade-all slide-from-right"> 
<section vertical layout> 
     <div id="noscroll" fit hero-p> 
     <div id="container" flex horizontal wrap around-justified layout cross-fade > 
      <section on-tap="{{selectView}}" id="polo_cards" > 

      <template repeat="{{item in productList}}"> 
       <div class="card" vertical center center-justified layout hero-id="item-{{item.id}}" hero?="{{$.polo_cards.selected === item.id || lastSelected === item.id }}" > <span cross-fade hero-transition style="">{{item.name}}</span></div> 
      </template> 
</section> 
     </div> 
     </div> 
    </section> 

    <template repeat="{{item in productList}}"> 
     <section vertical layout> 
     <div class="view" flex vertical center center-justified layout hero-id="item-{{item.id}}" hero?="{{$.polo_cards.selected === item.id || $.polo_cards.selected === 0}}" > 
      <core-icon-button class="go_back" icon="{{$.polo_cards.selected != 0 ? 'arrow-back' : 'menu'}}" on-tap="{{goback}}"></core-icon-button> 
      {{item.name}} <span cross-fade class="view-cont" style="height:1000px; overflow:scroll;"></span></div> 
     </section> 
    </template> 


    </core-animated-pages> 
</template>

template.selectView = function(e,detail,sender){ 

    /* set core-animated page Selected */ 
    var i = e.target.templateInstance.model.item.id; 
     sender.selected = i; 


    });

，如果我把所有详细的细节来看，将需要很长时间才能加载，所以我想加载每个产品的HTML当点击它的缩略图

怎么能我这样做？

来源

2015-05-31 Jijesh

我使用的应用程序，路由器延迟加载的元素或HTML，尤其是核心动画的页面。适用于科尔多瓦以及插入应用程序。但要小心，因为影子DOM不是默认的聚合物1.0，并且<core-animated-pages>移动到<neon-animated-pages>，并且在apis中有显着差异，所以当您尝试移植到1.0时不再有效，至少在重新工作前。但是，如果您打算坚持0.5或端口1.0而不使用核心动画页面，它仍然运行良好。你可以看看here。

来源

2015-05-31 13:33:26 Aravind

我的产品是动态的，我想从json加载数据，我不确定应用路由器如何在我的情况下工作。 – Jijesh

在''中配置的链接也可以是动态的。 ''从URL获取路径参数并作为属性传递给自定义元素。在core-ajax中使用该属性来获取json数据并填充已加载的自定义元素。这就是你需要的一切。认真阅读''文档。 – Aravind

聚合物进口动态HTML

回答

相关问题