CanJS и Усы

Question

У меня проблемы с использованием усов в моем приложении. Я украл "может..... усы" и у меня есть объект Model с такой структурой:

// widgets
Models.LayoutWidget = can.Model({
    findAll: 'GET /pages/{id}/layouts/widgets'
}, {});

Тогда с помощником приспособления это захватывает это правильно:

var LAYOUT_WIDGETS = [
    {
        id: 1,
        name: 'Menu',
        config: {
            width: 4,
            height: 1
        }
    }
];

и это шаблон:

<script id="layout-widget-template" type="text/mustache">
    <li class="layout-widget" {{data 'widget'}}>
        <span class="layout-widget-delete">&times;</span>
        <span class="layout-widget-name">{{name}}</span>
    </li>
</script>

и это код, который я использую, чтобы получить шаблон:

var template = can.trim(can.view.render('#layout-widget-template', widget));
// or
var template = can.trim(can.view('#layout-widget-template', widget));
// or same without trim

это просто дает мне

<li class="layout-widget" data-view-id='2'>
    <span class="layout-widget-delete">&times;</span>
    <span class="layout-widget-name"><span data-view-id='3'>@@!!@@</span></span>
</li> 

что это за "@@!!@@"??? это также не связывает данные правильно, потому что если я пытаюсь

can.data(el, 'widget'); // gives undefined!!

На моей странице есть другие шаблоны, которые корректно работают с этими элементами виджетов. Это сводит меня с ума!! я пробовал {{self.name}}, {{this.name}} также в моем шаблоне!!! Любая помощь??? Tnx заранее!!!

Answer 1

Символы, которые вы просматриваете, являются заполнителями для динамического связывания и исчезнут после добавления фрагмента документа в DOM.

Я рекомендую всегда использовать can.view потому что он возвращает фрагмент документа вместо can.view.render который возвращает строку (возможно, именно поэтому помощник по данным не работает, потому что данные могут быть присоединены только к элементам DOM). Фрагменты документа уже представляют собой структуру DOM, поэтому нет смысла запускать его через can.trim (фактически он преобразует его обратно в строку и обрезает эту строку, что, скорее всего, не то, что вам нужно).

Вот пример скрипки, который также записывает данные виджета на консоль: http://jsfiddle.net/3gD2p/

// widgets
var LayoutWidget = can.Model({}, {});

var widget = LayoutWidget.model({
        id: 1,
        name: 'Menu',
        config: {
            width: 4,
            height: 1
        }
    });

$('#dummy').html(can.view('layout-widget-template', widget));

console.log($('.layout-widget').data('widget'));