2016-08-27 32 views
0

试图jadenested object, 但each prod in order.productOrder一个json对象并不一代产量prod.name ...在JSON玉嵌套的对象将不显示

JSON

{ 
   "id": "57bf5800473ffcd9bec12845", 
   "userId": "57988bf249c8791e403ea6f0", 
   "paymentTrans": { 
      "trandId": 6720391068199, 
      "timestampApproved": "Sat Aug 27 2016 19:48:29 GMT+0300 (IDT)", 
      "timestampSent": "Sat Aug 27 2016 19:48:29 GMT+0300 (IDT)", 
      "serviceName": "PayPal" 
   }, 
   "totalPerOrder": 160, 
   "productOrder": [ 
      { 
         "total": 40, 
         "price": 4, 
         "quantity": 10, 
         "name": "Banana", 
         "sku": "BAN" 
      }, 
      { 
         "total": 120, 
         "price": 10, 
         "quantity": 12, 
         "name": "Fig", 
         "sku": "FIG" 
      } 
   ] 
} 

tbody 
    each order in orders 
     tr 
      td.tdRight= moment(order.paymentTrans.timestampSent).format('DD.MM.YYY') 
      td.tdCenter.price= order.totalPerOrder 
      td.tdLeft= order.paymentTrans.serviceName 
      td.tdCenter 
       button.btn.product.btn-primary(type='button', ng-click='showDetails()') 

     each prod in order.productOrder 
      tr.show.hidden 
       td.tdRight= prod.name 
       td.tdCenter= prod.price 
       td.tdCenter= prod.quantity 
       td.tdLeft= prod.total 
     br 

> 20|        td.tdRight= prod.name 
    21|        td.tdCenter= prod.price 
    22|        td.tdCenter= prod.quantity 
    23|        td.tdLeft= prod.total 
Cannot read property 'name' of undefined 

试过代码在这里jade-demo,它Worx的....

玉输入

doctype html 
html(lang="en") 
    head 
    title= pageTitle 
    script(type='text/javascript'). 
     if (foo) { 
     bar(1 + 5) 
     } 
    block content 
    .page-header 
     h3 ההזמנות שלי 
     table.table.table-bordered 
      thead 
       tr פירוט הזמנות 
      tbody 
       each order in orders 
        tr 
         td.tdRight= order.paymentTrans.timestampSent 
         td.tdCenter.price= order.totalPerOrder 
         td.tdLeft= order.paymentTrans.serviceName 
         td.tdCenter 
          button.btn.product.btn-primary(type='button', ng-click='showDetails()') 
        for prod in order.productOrder 
         tr.show.hidden 
          td.tdRight= prod.name 
          td.tdCenter= prod.price 
          td.tdCenter= prod.quantity 
          td.tdLeft= prod.total 
        br 

当地人

{ 
    orders: [ 
{ 
   "id": "57bf5800473ffcd9bec12845", 
   "userId": "57988bf249c8791e403ea6f0", 
   "paymentTrans": { 
      "trandId": 6720391068199, 
      "timestampApproved": "Sat Aug 27 2016 19:48:29 GMT+0300 (IDT)", 
      "timestampSent": "Sat Aug 27 2016 19:48:29 GMT+0300 (IDT)", 
      "serviceName": "PayPal" 
   }, 
   "totalPerOrder": 160, 
   "productOrder": [ 
      { 
         "total": 40, 
         "price": 4, 
         "quantity": 10, 
         "name": "Banana", 
         "sku": "BAN" 
      }, 
      { 
         "total": 120, 
         "price": 10, 
         "quantity": 12, 
         "name": "Fig", 
         "sku": "FIG" 
      } 
   ] 
}, 
{ 
"id": "57bf5800473ffcd9bec12845", 
"userId": "57988bf249c8791e403ea6f0", 
"paymentTrans": { 
    "trandId": 6720391068199, 
    "timestampApproved": "Sat Aug 27 2016 19:48:29 GMT+0300 (IDT)", 
    "timestampSent": "Sat Aug 27 2016 19:48:29 GMT+0300 (IDT)", 
    "serviceName": "PayPal" 
}, 
"totalPerOrder": 160, 
"productOrder": [ 
    { 
     "total": 40, 
     "price": 4, 
     "quantity": 10, 
     "name": "Banana", 
     "sku": "BAN" 
    }, 
    { 
     "total": 120, 
     "price": 10, 
     "quantity": 12, 
     "name": "Fig", 
     "sku": "FIG" 
    } 
] 
} 
    ] 
} 

UPDATE 1

td.tdCenter= order.productOrder 

给出:

[ { sku: 'APL', name: 'Apple', quantity: 2, price: 12, total: 24 }, { sku: 'AVC', name: 'Avocado', quantity: 2, price: 16, total: 32 } ] 
td

MongoDB的控制台

"productOrder" : [ { "sku" : "APL" , "name" : "Apple" , "quantity" : 2 , "price" : 12 , "total" : 24} , { "sku" : "AVC" , "name" : "Avocado" , "quantity" : 2 , "price" : 16 , "total" : 32}] 

webStorm快照和MongoDB webStorm snapshot of console and mongodb

订单截图与uniteratable order.productOrder数据 我只是增加了一个td行,以便:td.tdCenter= order.productOrder Orders Screenshot with missing data

UPDATE 2 - order.js控制器

exports.getOrders = (req, res) => { 

    Order.find() 
     .populate({ 
      path: 'orders', 
      match: { _id: req.user._id } 
     }) 
     .exec(function (err, orders) { 
      orders.forEach(function(elem){ 
       console.log("ELEM = " + elem.productOrder); 
       console.log("ELEM = " + typeof elem.productOrder); 
      }); 

      res.render('account/orders', { 
       title: 'ניהול ההזמנות שלי', 
       angularApp: 'storeApp', 
       orders: orders 
      }); 
     }); 
}; 

order.js

console.log("ELEM = " + elem.productOrder); enter image description here

如何解决此的控制台快照??

+0

你表示JSON是被显示在 “UPDATE” 从阵列不同。您的代码实际上是否会因您发布的JSON(“Banana”和“Fig”)而失败? – robertklep

+0

@robertklep,我正在使用的只是不同的样机数据...代码失败了,更多:'每个产品order.productOrder.length? order.productOrder:['empty']'returns' empty' ... – Jadeye

+0

我无法重现该问题,它对我来说工作得很好。查看[this gist](https://gist.github.com/robertklep/b7bda8efc7249d44fd839c914a32165e)查看生成的输出。 – robertklep

回答

0

首先我必须感谢@robertklep持久化&指导...
难以置信..... 3 dayz ...对这一决议:

order.js控制器

Order.find().lean() 
     .populate({ 

查询所需的lean() mongooose功能,以返回纯javascript objectsjade在嵌套对象的each & for回路可以解析,因此:

each order in orders 
    tr 
     td.tdRight= moment(order.paymentTrans.timestampSent).format('DD.MM.YYY') 
     td.tdCenter.price= order.totalPerOrder 
     td.tdLeft= order.paymentTrans.serviceName 
     td.tdCenter 
      button.btn.product.btn-primary(type='button', ng-click='showDetails()') 
       | פירוט 
    tr 
     td.tdRight= 'name' 
     td.tdCenter= 'price' 
     td.tdCenter= 'quantity' 
     td.tdLeft= 'total' 
    for prod in order.productOrder 
     tr 
      td.tdRight= prod.name 
      td.tdCenter= prod.price 
      td.tdCenter= prod.quantity 
      td.tdLeft= prod.total 

输出 chrome snapshoot 信用到

ecdeveloper's OS anser on Convert Mongoose docs to json