4

私は Backbone.js と Backbone.Marionette を初めて使用し、アプリケーションの最適なパターンに従おうとしていくつかの問題を抱えています。

PhoneGap でカプセル化されたモバイル Web アプリケーションを作成しています。私は一般的なレイアウト (Facebook のような) を持っています: 2 つのサイドバー、メイン ヘッダー、およびすべてのビューが読み込まれるコンテンツ ゾーン。

Backbone.Marionette アプリケーションの初期化コードは次のとおりです。

var App = new Backbone.Marionette.Application();

App.addRegions({
    leftRegion: '#left-drawer',
    rightRegion: '#right-drawer',
    headerRegion: '#header',
    contentRegion: '#content',
    mainRegion: '#main'
});

これは、コンテンツが添付される私の地域です。後で、ルーターを初期化した直後に、次のものがあります。

App.headerRegion.show(App.Views.Header);
App.leftRegion.show(App.Views.LeftSidebar);
App.rightRegion.show(App.Views.RightSidebar);

これにより、コンテンツがこの新しいリージョンに読み込まれます。この問題は HeaderView で発生します。私のヘッダービューのテンプレート:

<button id="open-left"><img src="assets/img/icons/menu-icon.png"></button>
<h1 class="title logo"><img src="assets/img/logo.png" height="28px" width="167px"></h1>
<button id="open-right"><img src="assets/img/icons/chat-icon.png"></button>

ItemView も非常にシンプルです。

var HeaderView = Backbone.Marionette.ItemView.extend({
    template: _.template(template),
});

<img>アプリの一部では、ヘッダーでを使用したくありません。アプリの一部のページでは、これをテキストに更新する必要があります。たとえば、<h1>Settings</h1>. 私の質問は、それを行う最善の方法は何ですか? または、それを行う方法は何ですか?今のところ、どこから始めればよいかわかりません。私が念頭に置いている唯一のアイデアは、別のテンプレートで新しい ItemView を作成することです。

前もって感謝します!

4

1 に答える 1