4

セットアップについて詳しく説明します。Backbone.LayoutManagerで使用するdust.jsテンプレートをプリコンパイルしました。

Backbone.LayoutManagerは、次の構成を使用します。

Backbone.LayoutManager.configure
  manage: true
  fetch: (name) ->
    name

したがって、テンプレートの名前はフェッチを介して直接レンダリングに渡され、次のようにレンダリングをオーバーライドしたいと思います。

render: (template, context) ->
  done = @async
  dust.render @template, context, (err, out) ->
    throw err if err
    done(out)

しかし、レンダリングではこれを行うことはできません（おそらく、LayoutManagerの作成者がテンプレートのレンダリングが同期すると想定したためです）。

誰かが私がこれを達成する方法を知っていますか？

4

1 に答える 1

4

テンプレートの非同期レンダリングを処理するには、LayoutManger を変更する必要があります。

renderこれを行う方法の 1 つは、呼び出しがオブジェクトのインスタンスを返すjQuery Deferred オブジェクトを使用することです。これは、ライブラリDeferredへの呼び出しで解決されます。Dust

次に、Backbone.LayoutManager を変更して、その Deferred オブジェクトが解決されるまで、テンプレートでやりたいことを続けないようにします。

でrender:

render: (template, context) ->
    dfd = $.Deferred()

    dust.render @template, context, (err, out) ->
        throw err if err
        done(out)
        dfd.resolve()

    return dfd;

次に、render を呼び出す Backbone.LayoutManager のメソッドを取得し、render からの戻り値で何かを行う代わりに、その「何か」を、done渡された deferred のハンドラーにアタッチします。

    dfd = render(template, context)
    dfd.done(do_something_with_this_template);

私は Marionette.js (非同期バリアントと共に) とダストを使用しています。これが私のコアrenderメソッドのようです。

    render: function(){
        var dfd = $.Deferred();

        var template_context = this.model;
        if(_.isUndefined(template_context) || _.isFunction(template_context)){
            template_context = new (Backbone.Model.extend({}));
        }

        if(this.id) this.$el.attr('id', this.id);

        var that = this;
        dust.stream(this.tpl_name, template_context.toJSON())
            .on('data', function(data){
                that.$el.html(data);
            })
            .on('end', function(){
                dfd.resolve();
                that.enable_menus();
                that.trigger('template:rendered');
            })
            .on('error', function(err){
                dfd.reject();
                window.le(err.message, err);
                that.trigger('template:error');
            });

        return dfd;
    }

(もちろん、coffeescript も使用していません...)

于 2012-09-25T19:07:30.473 に答える