web-dev-qa-db-fra.com

Modèle Backbone.js pour afficher la connexion

Je suis un débutant Backbone.js. Je jouais juste avec. Je voudrais savoir si le modèle est lié à la vue. Dans l'exemple todos fourni, je vois dans la méthode addOne, une nouvelle vue est créée et associée au modèle nouvellement créé et ajoutée.

  window.AppView = Backbone.View.extend({
     // view code
     addOne: function(todo) {
          var view = new TodoView({model: todo});
          this.$("#todo-list").append(view.render().el);
     }
  }

Lorsque j'ai essayé de faire une chose similaire, j'ai reçu une erreur disant "la méthode de liaison est introuvable sur undefined".

window.TodoView = Backbone.View.extend({

     initialize: function() {
          _.bindAll(this, 'render', 'close');
          this.model.bind('change', this.render); // I got the error at this place. 
          this.model.view = this;
     }
});

Afin de résoudre ce problème, je dois passer le modèle nouvellement créé en tant que paramètre au constructeur de vue et je dois faire this.model = task pour l'associer.

window.TodoView = Backbone.View.extend({

     initialize: function(task) {
          _.bindAll(this, 'render', 'close');
          this.model = task
          this.model.bind('change', this.render);// now there is no error
          this.model.view = this;
     }
});

window.AppView = Backbone.View.extend({


   insertTask:function(){
        var newTask, newTaskView;
        newTask = new Task(JSON.parse(xhr));
        Tasks.create(newTask);
        newTaskView = new TaskView({ model: newTask });
        $("#todo_list").append(newTaskView.render().el);
        this.input.val('');
}

});

Mais l'exemple de todos, n'a pas quelque chose comme ça. Comment le nouveau modèle est-il associé implicitement à la nouvelle vue dans l'exemple de todos?

Merci

javascriptbackbone.js
36
felix

Ce n'est pas implicite du tout, c'est explicite dans cette ligne ici:

var view = new TodoView({model: todo});

Cela crée une nouvelle vue TodoView et définit sa propriété model sur le seul paramètre de la fonction addOne (todo, qui est un modèle).

Chaque fois qu'un nouveau modèle est ajouté à la collection Todos, la méthode addOne est appelée avec le nouveau modèle comme paramètre.

Todos.bind('add', this.addOne);

Ensuite, dans addOne, une nouvelle vue est créée pour ce modèle et la relation est explicitement définie, via {model: todo}. C'est ce que vous manquez dans votre version du code, je suppose.

Ce que vous semblez essayer de faire est de lier la vue et le modèle dans la fonction init de la vue, et c'est très bien, mais vous êtes seul si vous le faites - ce qui signifie que vous devez configurer le modèle <-> voir la relation vous-même (que vous avez résolu en passant le modèle en tant que paramètre à la fonction view init).

38
Factor Mystic