2016-09-22 7 views
0

Интересно, может ли кто-то помочь найти в этом случае что-то не так. Я получаю "неперехваченным ReferenceError: текст не определен" в строке 6 app.js:Marionette.js - Uncaught ReferenceError: текст не определен

((__t=(text))==null?'':_.escape(__t))+ 

driver.js: Просмотры

var Marionette = require('backbone.marionette'); 
var TodoView = require('./views/layout'); 

var initialData = { 
    items: [ 
    {assignee: 'Scott', text: 'Write a book about Marionette'}, 
    {assignee: 'Andrew', text: 'Do some coding'} 
    ] 
}; 


var App = new Marionette.Application({ 
    onStart: function(options) { 
    var todo = new TodoView({ 
     collection: new Backbone.Collection(options.initialData.items), 
     model: new ToDoModel() 
    }); 
    todo.render(); 
    todo.triggerMethod('show'); 
    } 
}); 

App.start({initialData: initialData}); 

/layout.js

var Backbone = require('backbone'); 
var Marionette = require('backbone.marionette'); 
var ToDoModel = require('../models/todo'); 

var FormView = require('./form'); 
var ListView = require('./list'); 


var Layout = Marionette.View.extend({ 
    el: '#app-hook', 

    template: require('../templates/layout.html'), 

    regions: { 
    form: '.form', 
    list: '.list' 
    }, 

    collectionEvents: { 
    add: 'itemAdded' 
    }, 

    onShow: function() { 
    var formView = new FormView({model: this.model}); 
    var listView = new ListView({collection: this.collection}); 

    this.showChildView('form', formView); 
    this.showChildView('list', listView); 
    }, 

    onChildviewAddTodoItem: function(child) { 
    this.model.set({ 
     assignee: child.ui.assignee.val(), 
     text: child.ui.text.val() 
    }, {validate: true}); 

    var items = this.model.pick('assignee', 'text'); 
    this.collection.add(items); 
    }, 

    itemAdded: function() { 
    this.model.set({ 
     assignee: '', 
     text: '' 
    }); 
    } 
}); 

module.exports = Layout; 

todoitem.html

<%- item.text %> &mdash; <%- item.assignee %> 

Не можете объяснить, почему текст не определен?

+0

это выглядит как ошибка шаблона подчеркивания. Вероятно, это означает, что вы используете что-то вроде '<%= text %>' где-то в шаблоне html и что вы не передаете правильные данные в скомпилированный шаблон. –

+0

Я обновил вопрос: добавлен шаблон itemlist.html с выходом. – dev85

ответ

0

Вы должны взглянуть на Marionnette, которые объясняют, как визуализировать шаблон с пользовательскими данными.

var my_template_html = '<div><%= args.name %></div>' 
var MyView = Marionette.ItemView.extend({ 
    template : function(serialized_model) { 
    var name = serialized_model.name; 
    return _.template(my_template_html)({ 
     name : name, 
     some_custom_attribute : some_custom_key 
    }); 
    } 
}); 

new MyView().render(); 

Note that using a template function allows passing custom arguments into the .template function and allows for more control over how the .template function is called.

С кодом, который вы предоставили на данный момент, я не могу помочь.

+0

Вы можете попробовать с помощью шаблонаHelper ItemView, функции, которая будет запускать каждый рендер, и вы не хотите быть частью вашей модели – azibi

0

Marionette называет 'serializeModel' перед передачей контекста в 'шаблон'. Таким образом, если у вас есть backbone.model как

{ 
    . 
    . 
    . 
    attributes: { 
     text: 'someText', 
     asignee: 'someAsignee' 
    } 
    . 
    . 
} 

ваш шаблон получит

{ 
    text: 'someText', 
    assignee: 'someAsignee' 
} 

Я работал с рулями, но не подчеркивают точно. Там {{this.text}} и {{this.assignee}} работает как шарм в шаблоне. Итак, попробуйте this.text или text вместо item.text, посмотрите, что работает

1

проверить ToDoModel для опечатки, поле Магистральной модели должна быть «по умолчанию» не «по умолчанию», при разборе для шаблона кукольного вида ищет " «поле по умолчанию:

https://marionettejs.com/docs/master/template.html#rendering-a-model

поэтому код ToDoModel должен идти, как это:

... 
 

 
var ToDo = Backbone.Model.extend({ 
 
    defaults: { 
 
     assignee: '', 
 
     text: '' 
 
    }, 
 
    
 
...