Вывод модели типа Acts_As_Nested (комментарии) - PullRequest
Новая
       4

Вывод модели типа Acts_As_Nested (комментарии)

0 голосов
/ 25 февраля 2011

У меня есть Rails 3 Acts_As_Nested Модель для комментариев, которая имеет следующие поля:

  • id
  • parent_id
  • lft
  • rgt
  • content

С помощью Rails легко отобразить вложенный список комментариев, используя такие вещи, как .parent .children и т. д.

Но сейчасЯ хочу использовать KnockoutJS для вывода вложенных комментариев через шаблон jQuery.Как вывести вложение в jQuery Template + KnockoutJS?

1 Ответ

0 голосов
/ 25 февраля 2011

Размещено на форумах нокаутов, но добавлено и здесь, поскольку вопрос здесь отсутствует.

Хороший способ сделать это - вызвать шаблон рекурсивно. Если ваша структура является вложенной, то вы можете каждый раз передавать дочерние элементы в шаблон. Если ваша структура плоская, вам необходимо отфильтровать элементы, которые передаются в шаблон.

Образец здесь: http://jsfiddle.net/rniemeyer/Xydth/

Для плоской структуры это может выглядеть так: 

<ul data-bind="template: { name: 'comment', foreach: viewModel.getChildren(0) }"></ul>

<script id="comment" type="text/html">
    <li>
       <span data-bind="text: content"></span>   
        <ul data-bind="template: { name: 'comment', foreach: viewModel.getChildren($data.id) }"></ul>
    </li>
</script>

<script type="text/javascript">
function comment(id, parentId, content) {
    this.id = id;
    this.parentId = parentId;
    this.content = ko.observable(content);
}

var viewModel = {
    comments: ko.observableArray([
        new comment(1, 0, "one content"),
        new comment(2, 1, "two content"),
        new comment(3, 0, "three content"),
        new comment(4, 0, "four content"),
        new comment(5, 4, "five content"),
        new comment(6, 4, "six content"),
        new comment(7, 6, "secent content"),
        new comment(8, 0, "eight content")
        ]),
    getChildren: function(parentId) {
        return ko.utils.arrayFilter(this.comments(), function(comment) {
            return comment.parentId == parentId;
        });
    }
};

ko.applyBindings(viewModel);
</script>
...