2

Backbone.js をプロジェクトに統合していますが、サイドバーのコレクションの作成に問題があります。

問題となっている問題は、Smarty html-markup から生成されたものをモデルのコレクションに変換する方法です。通常の解決策は、前面にテンプレートを使用することですが、私の場合は非現実的です。

私のサイドバーのマークアップ:

<div class="nav-blocks">
{foreach from=$mod.nodes item=section}
  <div class="nav-block">
    <h2>{$section.title}</h2>
    <ul class="navigation">
    {foreach from=$section.nodes item=i}
      <li>{$i.title}</li>
    {/foreach}
    </ul>
  </div>
{/foreach}
</div>

.nav-blockそれぞれをモデルに結び付けたい:

var Navigation = Backbone.Model.extend({
  defaults: {
    'visible': true
  }
});

また、View からイベントがトリガーされると、モデル変更属性が表示されます。

var NavigationView = Backbone.View.extend({

  el: $('.nav-block'),

  events: {
    'click h2': 'toggleVisible'
  },

  initialize: function() {
    this.model.bind('change:visible', this.render, this);
  },

  toggleVisible: function() {
    this.model.toggle('visible');
  },

  render: function() {

  }

});
4

2 に答える 2

2

この方法で、バックボーンビューを既存のhtmlマークアップに適用できます。

$(function () {
    $('.nav-blocks > .nav-block').each(function(index, el) {
        new NavigationView({ model: new Navigation(), el: el });
    });
});

http://jsfiddle.net/rJDy4/で作業中のjsフィドル

于 2012-10-17T14:31:48.000 に答える
1

フロントエンドによって作成されていないdivとして.nav-block、ビューを作成するJquery Selectorでループし、それぞれをモデルに結び付け、このビューELをJQueryの返されたオブジェクトに設定する必要がありますview.setElement()

于 2012-10-17T12:00:41.763 に答える