Допустим, у меня есть такой JSON:
Пример JSON, мой json проверен на jsonlint и работает.
json_object = {
"texts_model": {
"hello": "hola",
"icon_text": "Icon!"
},
"collection_vias": {
"text": "hola",
"icon_text": "Icon!"
}
};
Я сделал коллекцию, которая анализирует содержимое json и создает модель и коллекции из этого json.
App.TemplatesCollection = Backbone.Model.extend({
model: App.TemplateModel,
url: TEMPLATES_SERVICE,
initialize: function(){
this.fetch({
success: (function () {
console.log(' Success ');
}),
error:(function (e) {
//console.log(' Error: ' + e);
}),
complete:(function (e) {
console.log(' Fetch completado con exito. ');
})
});
},
//Here i generate all my models and collections.
parse: function(response){
App.texts = new App.TemplateModel(response.text_model);
App.vias = new App.ViasCollection(response.collection_vias);
return response;
},
//I was trying with the get function but i the only thing i got was undefined.
plain_texts: function(){
return( this.get('plain_texts') ) ;
}
});
А вид такой:
App.TemplateView = Backbone.View.extend({ el: App.$main_content, initialize: function(){ _.bindAll(this, 'render'); }, //Здесь я передаю шаблон (html-источник), который хочу для рендеринга.рендеринг: функция(шаблон){ var html = рендеринг(шаблон, this.model.toJSON()); App.$main_content.html(html); вернуть это; } });
И мой start.js, где живут все объявления моих моделей и представлений:
//приложение Приложение = {
init: function(){
console.log('Iniciando...');
//variables y constantes
App.$main_content = $('#main-content-content');
App.$main_header = $('#main-header-content')
App.$main_navigation = $('#main-navigation-content');
//data
App.templates = new App.TemplatesCollection();
//views
App.templateView = new App.TemplateView({model: App.texts});
//router
App.router = new App.Router();
},
start: function(){
//init
App.init();
//router
Backbone.history.start();
}
}
И роутер:
//маршрутизатор App.Router = Backbone.Router.extend({
routes:{
"" : "index",
":web" : "url"
},
index: function(){
console.log("index");
//Here i do not know what to do, i mean do i have to instiate the View each time i go to index? or only render?
App.templateView = new App.TemplateView({model: App.texts});
App.templateView.render("sections/login/form");
},
url: function(web){
console.log(web);
}
});
//on document ready
$(function(){
App.start();
});
Моя проблема в том, что когда html загружается, единственное, что у меня есть, это: «Uncaught TypeError: невозможно вызвать метод toJSON неопределенного»
Но когда я помещаю это в консоль разработчика:
App.templateView = new App.TemplateView({model: App.texts});
App.templateView.render("sections/login/form");
Мое представление отображается правильно.
Почему мое представление не отображается при загрузке, а только тогда, когда я помещаю свой код в консоль разработчика?
Как я могу отобразить свою модель в представлении на URL-адресе маршрутизатора? Почему у меня есть undefined в html, загруженном на консоль разработчика?
----РЕДАКТИРОВАТЬ---
Хорошо,
Я думаю, что понял. Может быть, я создаю проблему для вещи, у которой не должно быть проблем.
Теперь моя модель выглядит так:
App.TemplatesCollection = Backbone.Model.extend({
model: App.TemplateModel,
url: TEMPLATES_SERVICE,
plain_texts: function(){
return this.get('texts') ;
},
initialize: function(){
this.fetch();
}
});
И вид:
App.TemplateView = Backbone.View.extend({
el: App.$main_content,
initialize: function(){
console.log(this.collection);
var ea = this.collection.get('texts');
console.log(ea);
},
render: function(template){
console.log(this.collection);
return this;
}
});
Теперь я вижу свою коллекцию внутри своего представления.
Но когда я пытаюсь сделать это, чтобы получить только текстовую версию в моем представлении:
var ea = this.collection.get('texts');
console.log(ea);
Я получаю ошибку неопределенного:
Uncaught TypeError: невозможно вызвать метод «получить» неопределенного
Любая идея о том, как я могу решить эту проблему?
Я пытаюсь решить это сам. Я не хочу выглядеть так, как будто я прошу разработать мое решение.
Заранее спасибо.