ハンドルバーのヘルパー出力がテンプレートに表示されない

Question

私はハンドルバーのヘルパーメソッドを持っています。これはajaxでjsonオブジェクトをフェッチしています。そのjsonをhtmlにフォーマットしてテンプレートに挿入します。

コンソールにhtmlを出力して出力を正しく表示しますが、
ハンドルバーヘルパーの結果はテンプレートに表示されません。

 
Handlebars.registerHelper("accounts_dropdown", function() { 
    function get_dropdown(callback){ 
    var dropdown='Select Account'; 

    $.ajax({ 
     url: 'accounts', 
     success: function(response){ 
      for(var i=0;i<response.length;i++){ 
      dropdown+=' < option value="'+response[i].id+'">'+response[i].name+'</option>'; 
       } 

      callback(dropdown); 
      } 
     }); 
    } 

    get_dropdown(function(dropdown){ 
     console.log(dropdown); 
     return new Handlebars.SafeString(dropdown); 
    }); 
    }); 

と私のテンプレートであなたが非同期的にドロップダウンをロードしているので、私は

 

{{accounts_dropdown}} 

Answer 1

これは、仕事に行くのではありませんしています。ヘルパー関数はHandlebarsがテンプレートに挿入する値を返す必要がありますが、ヘルパーは実際に何も返していません。 1つのオプションは、のようなので、同期、それをロードするために、次のようになります。

Handlebars.registerHelper("accounts_dropdown", function() { 
function get_dropdown(){ 
var dropdown='Select Account'; 

$.ajax({ 
    url: 'accounts', 
    async: false, 
    success: function(response){ 
     for(var i=0;i<response.length;i++){ 
     dropdown+=' < option value="'+response[i].id+'">'+response[i].name+'</option>'; 
      } 
     } 
    }); 

return dropdown; 
} 

return new Handlebars.SafeString(get_dropdown()); 
}); 

Answer 2

私は党へのビットlasteんだけど、私はただ同様の問題を抱えていたし、自分で解決策を見つけました。

ちょうどヘルパーにランダム/ユニークIDのdivを返し、その応答をajaxコールバックに挿入させます。もちろん

var id = 'my-async-template-' + Math.floor(Math.random() * 11); 

$.ajax({ 
    url: 'accounts', 
    async: false, 
    success: function(response){ 
    $('#' + id).html(response); 
}); 

return '<div id="' + id + '"></div>'; 
} 

は、それはあなたがサーバー上の全体のHTMLブロックを生成するか、ドロップダウンにオプションを注入するためにいくつかのより多くのJavaScriptを実行する必要があると思いOPの正確な問題で動作するようにします。

EDIT：あなたはそのように行う場合は、2番目の思想に

、あなたは競合状態を紹介しますので、ハンドルバーの後に、その仕事