【问题标题】:(Handlebars/JSON) nested each to read array(Handlebars/JSON) 嵌套每个以读取数组
【发布时间】:2018-02-05 22:08:32
【问题描述】:

我有一个family-table,属性member 作为数组。

第一个#each 工作正常,但我不能让第二个/嵌套的#each 工作以从family-table 中的数组读取数据(请参阅JSON 部分)。

我尝试了这两种方法都没有成功:

  {{#each family}}                   |      {{#each family as |x|}}
    <h1>{{surName}}</h1>             |         <h1>{{x.surName}}</h1>
                                     |
    {{#each member}}                 |         {{#each x.member as |y|}}
       <h1>{{firstName}}</h1>        |            <h1>{{y.firstName}}</h1>
    {{else}}                         |         {{else}}
       <h1>Not working</h1>          |            <h1>Not working</h1>
    {{/each}}                        |         {{/each}} 
                                     |
  {{else}}                           |       {{else}}
      <h1>No family</h1>             |           <h1>No family</h1>
  {{/each}}                          |       {{/each}}

JSON:

//family collection
{
    "_id": {
        "$oid": "5a6a906492b7b30014b18111"
    },
    "date": {
        "$date": "2018-01-26T02:20:20.428Z"
    },
    "surName": "x",
    "members": [
        {
            "firstName": "x"
        },
        {
            "firstName": "y"
        },
        {
            "firstName": "z"
        }
    ]
}

路线:

const express = require("express");
const mongoose = require("mongoose");
const router = express.Router();

    require("../models/Family");
    const Family = mongoose.model("family");

    router.get('/', (req, res) => {
        Family.find({}) 
        .sort({ date: 'desc' })
        .then(family => {
          res.render('family/index', {
            family: family
          });
        });
    });    
module.exports = router;

编辑:

我的 Family.js 模型

const mongoose = require('mongoose');
const Schema = mongoose.Schema;

//Create Schema
const FamilySchema = new Schema({
  surName: {
    type: String,
    required: true
  },
  firstName: {
    type: String,
    required: true
  },
  date: {
    type: Date,
    default: Date.now
  }
});

mongoose.model('family', FamilySchema);

【问题讨论】:

    标签: json node.js handlebars.js


    【解决方案1】:

    你需要改变的两个地方

    1. 您的家庭收藏必须是 array 而不是 object
    2. 提交的数据是members,而不是member

    以下代码有效

    app.js

    var express = require('express');
    var exphbs  = require('express-handlebars');
    var app = express();
    
    app.engine('handlebars', exphbs());
    app.set('view engine', 'handlebars');
    
    app.get('/', function (req, res) {
        const family = [{
          "_id": {
              "$oid": "5a6a906492b7b30014b18111"
          },
          "date": {
              "$date": "2018-01-26T02:20:20.428Z"
          },
          "surName": "x",
          "members": [
              {
                  "firstName": "x"
              },
              {
                  "firstName": "y"
              },
              {
                  "firstName": "z"
              }
          ]
      }]
    
        res.render('home', {
          family
        });
    });
    
    app.listen(3000);
    

    home.handlebars

    {{#each family as |family|}}                  
        <h1>{{family.surName}}</h1>           
    
        {{#each family.members as |member|}}                
           <h1>{{member.firstName}}</h1>       
        {{else}}                        
           <h1>Not working</h1>         
        {{/each}}                        
    
      {{else}}                          
          <h1>No family</h1>             
    {{/each}}  
    

    【讨论】:

    • “你的家庭收藏需要是一个数组而不是一个对象”——我该怎么做呢?我正在使用上传到 mLab 的 mongoDB。
    • 您可以在 Document Find Promise 链中尝试 toArray API collection.find({}).toArray(function(err, docs) { assert.equal(err, null); console.log("Found the following records"); console.log(docs) callback(docs); });
    • 我收到TypeError: Family.find(...).toArray is not a function。知道如何解决吗?
    • 我在问题中添加了路由部分的整个代码。
    • 如果没有成员,则车把部分不会渲染。但是您应该首先将关注点分开。我认为使用模拟的 JSON 来使这个渲染部分工作对你的问题来说是公平的。而且我认为我的代码适用于您的用例。希望它可以帮助你。如果没问题,请接受我的回答谢谢
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2018-09-26
    • 2019-06-13
    • 1970-01-01
    • 2020-04-07
    • 2021-03-27
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多