cargando la plantilla de manillares de forma asíncrona

Estoy tratando de escribir una función que me dé una plantilla de manillares comstackda (tengo todas mis plantillas en archivos separados) usando una llamada ajax para obtener la plantilla y comstackrla para su uso, pero necesito usar una promesa para poder en realidad lo utilizan.

function getTemplate(name){ $.get('/'+name+'.hbs').success(function(src){ var template = Handlebars.compile(src); //can't return the template here. }); } 

¿Cómo hago esto con promesas para que pueda hacer algo como:

 $("a").click(function(e){ getTemplate('form').done(function(template){ $("body").append(template({ name: "My Name" }) ); }); }); 

Chovy, veo que has aceptado una respuesta pero te puede interesar saber que getTemplate puede, al encadenar .then() lugar de .success() , escribirse casi como en la pregunta:

 function getTemplate(name) { return $.get('/'+name+'.hbs').then(function(src) { return Handlebars.compile(src); }); } 

o, adoptando la idea de charlietfl para pasar datos y devolver una Promesa de un fragmento completamente compuesto:

 function getTemplate(name, data) { return $.get('/'+name+'.hbs').then(function(src) { return Handlebars.compile(src)(data); }); } 

El efecto neto es idéntico a la versión de getTemplate de getTemplate pero .then() hace que no sea necesario crear un Aplazado explícitamente. El código es así más compacto.

A continuación se agrega un argumento de datos a la función getTemplate , así como el nombre de la plantilla.

 $(function(){ var postData={title: "My New Post", content: "This is my first post!"}; getTemplate('template-1',postData).done(function(data){ $('body').append(data) }) }); function getTemplate( name,data){ var d=$.Deferred(); $.get(name+'.html',function(response){ var template = Handlebars.compile(response); d.resolve(template(data)) }); return d.promise(); } 

MANIFESTACIÓN

Creé una biblioteca para ayudar con este tipo de problema, consulte en github

Solo tienes que agregar esto a tu vista principal de la aplicación:

  

pon esto en tu MainApp

 var MainApp = Em.Application.create({ LOG_TRANSITIONS: true, ready: function () { /** your code **/ MainApp.AppContainerView = Em.ContainerView.extend({}); MainApp.ModalContainerView = Em.ContainerView.extend({}); /** And other containerView if you need for sections in tabs **/ }); 

Y a ellos, por ejemplo, para abrir un modal con la plantilla que desea, solo tiene que:

 FactoryController.loadModalTemplate(templateName, callback); 

Y no olvides añadir el FactoryController y el RepositoryController.