閱讀嵌套模板的內容

如何獲得嵌套<template>的.content的JS訪問權限？閱讀嵌套模板的內容

我想用我的imported-template元素擴展<template>（其獲取來自外部文件的模板內容），我想以類似的方式來實現<imported-content>到本地<content>。要做到這一點，我只是嘗試

this.content.querySelector("imported-content")

但它發生了，對於嵌套模板this.content是空的。

<script> 
    (function() { 
     var XHTMLPrototype = Object.create((HTMLTemplateElement || HTMLElement).prototype); 
     XHTMLPrototype.attachedCallback = function() { 
      //.. 
      var distributeHere = this.content.querySelector("imported-content"); 
      var importedContent = document.createElement("span"); 
      importedContent.innerHTML = "Imported content"; 
      distributeHere.parentNode.replaceChild(importedContent, distributeHere); 
     } 

     document.register('imported-template', { 
      prototype: XHTMLPrototype, 
      extends: "template" 
     }); 
    })(); 
</script> 
<template id="fails" bind> 
    <ul> 
     <template is="imported-template" bind="{{ appdata }}"> 
      <li> 
       <imported-content></imported-content> 
      </li> 
     </template> 
    </ul> 
</template>

的jsfiddle here

我不知道這是否是一個錯誤，一個設計問題，或者只是模板墊片限制。

我以爲也許我在錯誤的生命週期回調中檢查它，所以我嘗試了MutationObserverfiddle here，但是也沒有發生突變。

來源

2014-05-14 tomalec

你能簡化你的代碼嗎？看起來好像是在做一堆事情，其中許多事情不必處理你遇到的問題。你的代碼越簡單，我們就越容易理解你想要做什麼，想要發生什麼以及實際發生了什麼。 –

我changed您的選擇器this.content.querySelector("[is='imported-content']")。這是你想要做什麼？

來源

2014-05-24 12:21:23 guillaume

不是。我試圖獲取元素 – tomalec

閱讀嵌套模板的內容

回答

相關問題