0

我正在创建一个等待列表类型的应用程序。我目前有它,我的表将填充集合。我希望能够按下一个按钮并将表格中的那一行移动到表格的底部。这是填充表格的地方。

<tbody>
                            {{#each student}}
                                <tr  class="accordion-toggle mainRow"> <!--mainRow if want whole row to change green-->
                                    <td>{{> expandButton}}</td>
                                    <td>{{Name}}</td>
                                    <td>{{PhoneNumber}}</td>
                                    <td>{{VipID}}</td>
                                    <td class="selectionChange">{{> buttonSelections}}</td>
                                </tr>
                                <tr>
                                    <td colspan="12" class="hiddenRow">
                                        <div class="accordian-body collapse" id="{{this._id}}">
                                            <table class="table table-striped">
                                                <thead id="innter-table">
                                                    <tr class="info">
                                                        <th id="inner-heading">Reason for Visit</th>
                                                        <th id="inner-heading">Current Major</th>
                                                        <th id="inner-heading">Intended Major</th>
                                                        <th id="inner-heading">Comments</th>
                                                    </tr>
                                                </thead>
                                                <tbody>
                                                    <tr>
                                                        <td>{{ReasonForVisit}}</td>
                                                        <td>{{CurrentMajor}}</td>
                                                        <td>{{IntendedMajor}}</td>
                                                        <td>{{Comments}}</td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </div>
                                    </td>
                                </tr>
                                {{> autoformModals}}
                            {{/each}}
                        </tbody>

这是按钮的模板:

<template name="buttonSelections">
 ...//other code for different buttons

<button class="btn btn-default btn-sm">
    <span class="glyphicon glyphicon-arrow-down"></span>
</button>

 ... //other code for different buttons
</template>

我知道按钮需要某种类型的事件。但我不确定如何让集合中的项目在集合中移动,以便当它再次填充表格时,它会移动到底部。

如何让集合重新排序,以便所选项目移动到集合的末尾?

4

1 回答 1

1

您不会“移动”您的收藏中的项目,您要做的是在客户端对收藏进行排序,以便显示您想要的方式。我没有看到相关的助手,但它看起来像这样:

<template name="Students">
    {{#each student in students}}
        {{student.name}}
    {{/each}}
</template>

在 JS 中,这是非常标准的东西:订阅 onCreated() 中的集合,然后助手按您想要的方式对集合进行排序。在这里,我正在组成一个字段“waitListedTime”,集合按该字段排序。您的按钮按下可以为所选学生添加时间戳,帮助程序将响应式运行,您的学生列表将在屏幕上更新。

Template.Students.onCreated(function() {
    this.subscribe('students');
});

Template.Students.helpers({
    students() {
        return Students.find({}, {sort: {waitListedTime: 1}});
    }
});
于 2017-02-28T01:52:28.033 回答