1

我正在使用 nodeJS、express、MongoDB 和 Handlebars 开发一个简单的 Web 应用程序。服务器端我使用快速车把：

var exphbs = require('express-handlebars');
// View Engine
app.set('views', path.join(__dirname, 'views'));
app.engine('handlebars', exphbs(
    {
        defaultLayout:'layout',
        helpers: { /*my helpers*/}}));

因此，当我查询数据库时，我想在页面中向客户端显示结果： /* some code */ router.get('/', function(req, res) {

    /*query to mongo DB with mongoose*/
    Coll.find(queryParams, function(err,coll){
        if(err) {
                    console.log(err);
                    throw err;
                }
                else {
                    res.render('index', {'coll': coll});
                }
    });

使用把手显示结果非常简单：

{{#each coll}}
{{this}}
{{/each}}

但是我想允许用户在不与服务器再次交互的情况下对这个元素数组进行排序，因为查询结果是相同的并且只会改变顺序。 html代码将是：

<select id=id>
<option>sort1</option>
<option>sort2</option>
</select>
{{#each list}}
{{this}}
{{/this}}
<script>
$(document).ready(function () {
    $('#id').change(function(){

//DO SOME STUFF WITH LIST
});
</script>

是否存在对通过 res.render(...) 传递的数组进行客户端排序的方法？ 如果用户在选择标签中选择一个选项，我可以使用 AJAX 修改列表吗？如何？（始终不与服务器交互，也不在 mongoDB 上再次执行相同的查询）

PS：我是nodeJS和Handlebars的初学者，请耐心等待！

4

1 回答 1

0

您当前的方法是在服务器上执行把手模板，并将生成的结果字符串作为呈现的 html 的一部分传递。

您有两种选择 - 在客户端重新解释 html 以将其放入可以排序的数组中，然后尝试将数组重新格式化为 html...，或者对服务器进行 AJAX 调用以获取数据完全在客户端代码中处理它。

第一种方法很棘手，导致代码很难维护。后一种选择要好得多，并为您提供更大的灵活性。

为此，您需要使用 res.send 或 res.json 将数据传回（有关更多详细信息，而不是 res.render，请参阅此链接。您可以保留对 JavaScript 代码中传递的原始数据的引用，以便您可以允许稍后进行排序。

然后，您将希望通过向 AJAX 调用传递对您的数据的引用来执行您的车把模板客户端（或使用 JavaScript 进行操作 - 尽管使用车把更容易）。

要完成你想要的，还有很多事情要做。我将从能够从 res.json() 调用（或 res.send()）中获取数据开始，并将获得的数据写入控制台。然后，您可以专注于客户端模板的编译和执行。最后，您可以添加脚本代码以启用以各种方式对数据进行排序。

于 2017-03-19T21:43:04.833 回答