Ember FastBoot SimpleDOM Körper ist leer

Question

Ich versuche, aus dem DOM in einem Instanzinitialisierer in der FastBoot-Umgebung zu lesen, aber document.body scheint leer zu sein. Der folgende Code funktioniert im Browser gibt aber nichts in Fastboot:

const ELEMENT_NODE_TYPE = 1; 

// TODO(maros): Get this working with FastBoot. For some reason the SimpleDOM 
// body is empty. 
const findBootstrapData = (document) => { 
    for (let currentNode = document.body.firstChild; currentNode; currentNode = currentNode.nextSibling) { 
    if (currentNode.nodeType !== ELEMENT_NODE_TYPE) { 
     continue; 
    } 

    if (currentNode.getAttribute('class') === 'bootstrap-data') { 
     return JSON.parse(currentNode.firstChild.nodeValue); 
    } 
    } 
}; 

export function initialize(appInstance) { 
    const store = appInstance.lookup('service:store'); 
    const document = appInstance.lookup('service:-document'); 

    const data = findBootstrapData(document); 
    if (data) { 
    store.push({ data: data.posts }); 
    } 
} 

export default { 
    name: 'blog-posts', 
    initialize 
}; 

Die Daten, die ich versuche, in den {{content-for "body"}} Abschnitt injiziert wurde, lesen unter Verwendung eines Ember CLI Addon. Dies funktioniert perfekt ohne FastBoot.

Wie kann ich diesen Instanzinitialisierer in FastBoot arbeiten lassen?

---

Edit:

Für zusätzlichen Kontext, hier ist, wie ich das DOM bin bevölkere einen Ember CLI Addon mit:

/* eslint-env node */ 
'use strict'; 

const fs = require('fs'); 
const path = require('path'); 
const convertMarkdown = require('marked'); 
const parseFrontMatter = require('front-matter'); 

// Reads blog posts from `/posts`, compiles from markdown to HTML and stores 
// as JSON in a script tag in the document. An instance initializer then picks 
// it up and hydrates the store with it. 
module.exports = { 
    name: 'blog-posts', 

    contentFor: function(type) { 
    if (type !== 'body') { 
     return; 
    } 

    const dirname = path.join(__dirname, '..', '..', 'posts'); 
    const data = fs.readdirSync(dirname).map((filename, index) => { 
     if (!filename.endsWith('.md')) { 
     return; 
     } 

     const fileContent = fs.readFileSync(path.join(dirname, filename), 'utf-8'); 
     const frontMatter = parseFrontMatter(fileContent); 

     return { 
     id: index + 1, 
     type: 'post', 
     attributes: { 
      title: frontMatter.attributes.title, 
      body: convertMarkdown(frontMatter.body), 
     }, 
     }; 
    }); 

    return ` 
     <script class="bootstrap-data" type="text/template"> 
     ${JSON.stringify({ posts: data })} 
     </script> 
    `; 
    } 
}; 

Answer 1

document.body wird immer während des App-Boot-Lebenszyklus leer sein. Da das Rendering noch nicht abgeschlossen ist (während der Instanzinitialisierungsphase), werden die Fastboot-Platzhalter nicht ersetzt.

Sie können eine der folgenden tun: http://ember-fastboot.com/docs/user-guide#the-shoebox

Wenn Sie wollen, es zu tun außerhalb des App-Lebenszyklus:

1. Sie den Schuhkarton API, um die Fast Boot Bootstrap-Daten zu schieben verwenden könnte und erhalten , dann könntest du es nach fastboot.visit Anfrage tun und nach result.html() wird aufgerufen.