2016-08-27 66 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