привязать представление коллекции к другому представлению - PullRequest
Новая
       1

привязать представление коллекции к другому представлению

0 голосов
/ 04 февраля 2012

Я использую основу с гемом backbone-rails, который имеет свою собственную структуру шаблонов и проект.

Проблема в том, что он помещает 4 различных представления в один div, поэтому я сделал еще один div, и теперь представления модели, шоу, редактирования назначены этому другому представлению, так что я могу иметь список на левая сторона страницы и все остальное посередине.

Проблема в том, что я не могу перенаправить сейчас, поэтому при обновлении или создании новой «заметки» представление списка не обновляется.

Список: 

  Supernote.Views.Notes ||= {}



  class Supernote.Views.Notes.IndexView extends Backbone.View

  template: JST["backbone/templates/notes/index"]



   initialize: () ->

  @options.notes.bind('reset','change', @addAll)





 addAll: () =>

 @options.notes.each(@addOne)



 addOne: (note) =>

 view = new Supernote.Views.Notes.NoteView({model : note, collection: @options.notes})

  @$("li").append(view.render().el)



 render: =>

 $(@el).html(@template(notes: @options.notes.toJSON() ))

 @addAll()



 return this

Редактировать вид: 

  Supernote.Views.Notes ||= {}



 class Supernote.Views.Notes.EditView extends Backbone.View

  template : JST["backbone/templates/notes/edit"]



 events :

  "submit #edit-note" : "update"



 update : (e) ->

  e.preventDefault()

  e.stopPropagation()



  @model.save(null,

  success : (note) =>

    @model = note

    window.location.hash = "/#{@model.id}"

   )



 render : ->

  $(@el).html(@template(@model.toJSON() ))



 this.$("form").backboneLink(@model)



 return this

1 Ответ

2 голосов
/ 04 февраля 2012

События - это то, что вам нужно, когда модель добавляется в коллекцию (новая заметка), она вызывает событие add в самой коллекции

, поэтому в вашей коллекции вы можете отловить это и сделать что-то сit. 

var myCollection = Backbone.Collection.extend({
   //... whole lot of irrelevant stuff goes here :)
});

var myCollectionListView = Backbone.View.extend({

  initialize: function(){
    _.bindAll(this, 'onAdd');
    this.collection.bind('add', this.onAdd);
  }

  onAdd: function(m){
    // either re-render the whole collection
    this.render();

    // or do something with the single model
    var item = $('<li>' + m.get('property') + '</li>');
    $('#listview').append(item);
  }

});


var myItems = new myCollection({});
var listview = new myCollectionListView({ collection: myItems });

, тогда у вас есть добавленная заметка (то же самое, что вы могли бы сделать для события reset или remove, которое обрабатывает сброс коллекции с новым списком моделей,и удаление модели из коллекции)

Допустим, вы обновили заметку, это должно быть сделано с той же системой событий, хотя для этого можно использовать событие change.хитрость здесь в том, что представление списка отображает не сами элементы модели, а представление списка создает представление модели для каждой модели.в этом виде модели (вы назвали его NoteView) вы можете выполнить тот же процесс, что и выше, и связать его с собственной моделью: 

initialize: function() {
  this.bind('change', this.modelChanged);
},

modelChanged: function(m){
  // do something, re-render the view, or anything else...
}
...