Не могу передать значение в представление
html
<style>
fieldset {border:0; width:50%;background: grey}
</style>
<form id="todo" style="border:1px solid red; min-height:20px;"></form>
<script type="text/template" id="item-template">
<fieldset>
<input id="todo_complete" type="checkbox" <%=completed ? 'checked="checked"' : '' %>>
</fieldset>
</script>
Модель:
var Todo = Backbone.Model.extend({
defaults :{title:'old',completed: true},
docTitle : 'Todo title'
});
var myTodo = new Todo ({docTitle:'myTodo title',completed: false, title: 'new'});
Представление:
var TodoView = Backbone.View.extend({
//id:'todo',
todoTpl: _.template($('#item-template').html()),
events: {
'click':'click_function'
},
initialize: function(){
this.render();
},
render: function(){
this.$el.html ( this.todoTpl ( this.model.toJSON() ) );
document.title = this.model.docTitle;
return this;
},
click_function: function(e){
console.log(e.target.tagName);
console.log(this.$el === e.target);
}
});
var todoTiew = new TodoView({model: myTodo, el :$("#todo")});
Запускаю, но title у страницы почему-то выводится "Todo title", а не "myTodo title" и значение title тоже не меняется. Почему? Далее когда я щелкаю по тегу форм, console.log(this.$el === e.target); почему-то выдает false. Почему? |
Цитата:
this.model.docTitle; Это свойство объекта, которое в данном случае берется из прототипа (из конструктора) __proto__.docTitle и значение которого было задано в:
var Todo = Backbone.Model.extend({
defaults : {title:'old', completed: true},
docTitle : 'Todo title'
});
Оно не было изменено в дальнейшем кодом:
var myTodo = new Todo ({docTitle:'myTodo title',completed: false, title: 'new'});
который записывает значение не в __proto__.docTitle , а в attributes.docTitle измените (как вариант): document.title = this.model.docTitle; на document.title = this.model.attributes.docTitle; или через API библиотеки Backbone:
document.title = this.model.get('docTitle');
Цитата:
e.target содержит ссылку на элемент form#todo Это разные объекты, поэтому результат их сравнения через "===" false Измените временно код на:
click_function: function(e){
console.log(e.target.tagName);
console.log('e.target : ');
console.dir(e.target);
console.log('this.$el : ');
console.dir(this.$el);
console.log(this.$el === e.target);
}
и посмотрите самостоятельно, что там содержится |
| Часовой пояс GMT +3, время: 14:40. |