Backbone.js - ビューヘルパーを定義する場所は？

Question

私はBackbone.jsのタイヤを蹴っていて、ここ数週間の間に遊びをしていたので、ちょっと質問がありました...

ビューヘルパーを定義して使用するには、 backbone.js？

私の考える限り、テンプレートで使用するヘルパーを定義する実際の唯一の場所は、モデルまたはコレクションそのものです。しかし、そのヘルパーがHTMLを直接返すと、これはちょっと汚い感じになります。

良い方法がありますか？

Answer 1

私はBACKBONE.JSでビューヘルパーを入れて、いくつかの異なる場所があります。ヘルパーは、特定のビューに固有である場合

が右ビュー定義に入れ、：

var MyView = Backbone.View.extend({ 
    tagName: 'div', 

    events: { 
    ... 
    }, 

    initialize: function() { ... }, 

    helperOne: function() { 
    // Helper code 
    }, 

    anotherHelper: function() { 
    // Helper code 
    }, 

    render: function() { 
    ... this.helperOne() ... 
    } 
}); 

ヘルパーは、すべてのビューは、この機能を継承するように、バックボーンViewクラスを拡張し、すべてのビューで使用される場合は、次の

_.extend(Backbone.View.prototype, { 
    helper: function() { 
    // Helper code 
    } 
} 

あなたは、ビュー間のヘルパーのより複雑な共有を必要とする意見がお互いを拡張している場合：

var MyOtherView = MyView.extend({ 

    // ... 

    render: function() { 
    ... this.helperOne() ... 
    } 
}); 

私はベストプラクティス（または確立されたベストプラクティスがある場合）であるかわからないんだけど、これらのパターンはかなりきれいに見え、うまくいく。

Answer 2

大きなバックボーンアプリケーションを作成するときには、すべての名前空間を使用することをお勧めします。それでは、グローバルヘルパーのための場所があります。私は完全な名前空間の設定をまだしていません。しかし、今、私はこのような何かをやっている：

brainswap:{ 
    appView: {},   <== Reference to instantiated AppView class. 
    classes = {   <== Namespace for all custom Backbone classes. 
    views : {}, 
    models : {}, 
    collections: {}, 
    controllers : {}, 
    Router: null 
    }, 
    models: {},   <== Instantiated models. 
    controllers: {},  <== Instantiated controllers. 
    router: {},   <== Instantiated routers. 
    helpers: {},   <== Reusable helper platform methods. 
    currentView: {},  <== A reference to the current view so that we can destroy it. 
    init: function(){} <== Bootstrap code to start app. 
} 

マイビュークラスは、このような何かを見て：

brainswap.classes.views.profile.contact = brainswap.classes.views.profile.base.extend({... 

私のコントローラは、新しいビューをインスタンス化（およびcurrentView内の参照を置くオブジェクトです。前のビューのイベントすべてがunbinded取得し、メモリ使用量を減らすように、あなたは常にあなたの最後のビューを削除する必要があります覚えておいてください。

Answer 3

クイックソリューション（CoffeeScriptの）

Backbone.View::handlebarsTemplate = (templateName) -> 
    Handlebars.compile $(templateName).html() 

次に、あなたがあなたのビューでそれを使用することができます。

Yourcoolapp.Views.ThingsIndex extends Backbone.view 

    initialize: -> 
    @template = this.handlebarsTemplate("#hb_template") 
    # etc... 

    someMethod: => 
    @template = this.handlebarsTemplate("#hb_other")