如何在Ember.Handlebars.compile之后更新视图？

Question

我使用emberJS（无Rails的），并在不同的文件中的模板模板/ *。HBS

我使用AJAX来查询他们和编译模板。

App.SetupTemplate = function(name) {    
      $.ajax({url:"templates/"+name+".hbs", success: function(response) { 
      Ember.TEMPLATES[name] = Ember.Handlebars.compile(response);   
    } });                   
    };                   


    App.ProfileRoute = Ember.Route.extend({          
      setupController: function(controller) { App.SetupTemplate('profile'); 
    },                   
    });   

如果我点击ProfileRoute，它会编译模板，但不会自动在视图中自动更新。 但它适用于以后点击相同的路由，因为模板已经编译并且视图已正确呈现。 我不知道如何使用transitionTo来实现相同的路线。

我该怎么做才能自动更新第一次点击自身的视图？

- 谢谢。

Answer 1

你需要阻止过渡，直到模板实际上已经被下载

App.needsTemplate = function(name){ 
    return Ember.isEmpty(Ember.TEMPLATES[name]); 
}; 
App.setupTemplate = function(name) { 
    return new Ember.RSVP.Promise(function(resolve, reject){ 

     if(!App.needsTemplate(name)){ 
     resolve(); 
     } else { 
     $.ajax({url:"templates/"+name+".hbs"}).then(function(response){ 
      Ember.TEMPLATES[name] = Ember.Handlebars.compile(response); 

      resolve(); 
     }); 
     }                       
    }); 
}; 


App.IndexRoute = Ember.Route.extend({ 
    model: function() { 
    return ['red', 'yellow', 'blue']; 
    }, 
    afterModel: function(model, transition){ 
    if(App.needsTemplate('index')){ 
     transition.abort(); 
     App.setupTemplate('index').then(function(){ 
     transition.retry(); 
     }); 
    } 
    } 
}); 

http://emberjs.jsbin.com/OxIDiVU/340/edit