en utilisant fetch pour ensuite compiler un modèle de handlebarsjs l'intérieur d'une promesse

Question

données en utilisant fetch puis Comparaison exécuter avec Guidons est assez facile lorsque vous avez déjà compilé vos modèles ..

var template  = Handlebars.compile(the-html); 
fetch('data.json') 
    .then(function(response) { 
     return response.json(); 
    }) 
    .then(function(json) { 
     var html = template(json[0]); 
     // use this somehow 
    }); 

Mais je veux chercher un numéro des fichiers (balisage et script qui contiennent des balises de guidon) basés sur un chemin prédéterminé dans la chaîne de promesses, et les compilent en tant que modèles Handlebars, puis les appliquent à un modèle que j'ai préalablement préparé dans une chaîne de promesses.

var json = {some-data}; 
some-promise-step() 
.then(function(json) { 
    var templates = Handlebars.templates = Handlebars.templates || {}; // global handlebars object 
    var urls = ["/abc/templates/" + json.template + "/index.html", "/abc/templates/" + json.template + "/style.css", "/abc/templates/" + json.template + "/script.js"]; // simplified 
    var promises = urls.map(function(url) { 
     return fetch(url).then(function(response) { 
     var name = response.url.split("/").pop(); 
     return response.text().then(function(data) { 
      templates[name] = Handlebars.compile(data); 
     }); 
     }); 
    }); 
    return Promise.all(promises); 
}).then(function(result) { // result is an array of 'undefined' ?? hmm 
    return Promise.all([ 
    zip.file("index.html", Handlebars.templates["index.html"](json)), 
    zip.file("style.css", Handlebars.templates["style.css"](json)), 
    zip.file("script.js", Handlebars.templates["script.js"](json)), 
    ]); 
}).then(// more steps 

Guidons doit compiler dans le Handlebars.templates objet global [] (qui existe déjà) avant de pouvoir être utilisés par l'étape suivante (dans laquelle l'objet zip est alimenté la sortie du modèle appliqué et retourne une promesse)

Mais au moment où les récupérations sont retournées et la méthode .text() retourne pour compiler le modèle, la promesse externe a résolu et a commencé à essayer d'utiliser les modèles.

Je ne veux pas que la .then( finale pour commencer à faire ce qu'il faut jusqu'à ce que les promesses ont tous décidé aller chercher ...

Answer 1

Aha! Ne renvoyez pas la promesse d'aller chercher; renvoie une promesse qui se résout lorsque la promesse answer.text() de la récupération se termine. Pourrait encore optimiser cette idée, mais cela semble fonctionner pour l'instant.