javascript - 当我从 Handlebars 返回一个值时,我正在获取作为对象的值。如何获得内在值(value)

标签 javascript node.js handlebars.js

Output of these console.log is Settlement data for resubmit is = [object Object] When data is stringifyed the we get = "[object Object]" Settlement data for resubmit is = [object Object] When data is stringifyed the we get = {"Record":"[object Object]"} but we want data from inside the settleFight (complete data of settleFight):

JSON is like this: 
"Data": [
    {
        "Key": "HELLOWORLD1234",
        "settleFight": {
            "ATransfers": [
                {
                    "From": "Delhi",
                    "To": "Mumbai",
                    "ID": "ACK1994",
                    "Qty": "900",
                }
            ],
            "LastUpdatedTimestamp": "2018-05-01 10:30:06.91983248 +0000 UTC",
            "ObjectType": "SETTLEMENT",
            "Reason": "FIGHT",
            "SettlementStatus": "FAILED",
            "SettlementType": "FORCED",
            "Version": 1
        }
    }
]




  <script>
    window.reSettle = function (SettlData){ 
         console.log(" Settlement data for resubmit is = " + SettlData);         
console.log("When data is stringifyed the we get = " + JSON.stringify(SettlData));
      var valueS= {}; valueS = {"Record": SettlData}; 
     console.log(" Settlement data for resubmit is = " + valueS);
     console.log("When data is stringifyed the we get     = " +
     JSON.stringify(valueS)); 
     console.log("When data is PARSed the we get
     = " + JSON.parse(valueS)); 
    </script> 
    <body> 
    <div style="cursor:pointer; color:blue; text-decoration:underline;"
     onclick="reSettle('{{settleFight}}');">Resettle</div> 
    </body>

最佳答案

您好,您会在下面找到一段使用您的数据的代码段以及两个您可能会觉得有用的示例。

您必须使用 {{#each}} 来迭代您的数组数据。 each 循环中的上下文是传递给 each 循环的数据,因此如果您传递 ATransfers,请使用 {{ID}}。另一种不迭代数组的方法是使用直接表示法 {{Data.0.settleFight.ATransfers.0.ID}} ,其中 0 是数组中的出现。我个人不建议使用这种表示法,因为如果数组没有元素,它就会失败,而且您不明白为什么。

另一句话:在您的示例中,您没有使用数组,因为它们中只有一个元素。如果它们不是强制性的,您可以使用以下方法简化您的数据:

var context = { "Data": [
    {
        "Key": "HELLOWORLD1234",
        "settleFight": {
           "ATransfers": {
                    "From": "Delhi",
                    "To": "Mumbai",
                    "ID": "ACK1994",
                    "Qty": "900",
            },
            "LastUpdatedTimestamp": "2018-05-01 10:30:06.91983248 +0000 UTC",
            "ObjectType": "SETTLEMENT",
            "Reason": "FIGHT",
            "SettlementStatus": "FAILED",
            "SettlementType": "FORCED",
            "Version": 1
        }
     }
  }

如果这样做,您将不需要 {{#each}},您可以使用 {{Data.settleFight.ATransfers.ID}}

var obj = { "Data": [
    {
        "Key": "HELLOWORLD1234",
        "settleFight": {
            "ATransfers": [
                {
                    "From": "Delhi",
                    "To": "Mumbai",
                    "ID": "ACK1994",
                    "Qty": "900",
                }
            ],
            "LastUpdatedTimestamp": "2018-05-01 10:30:06.91983248 +0000 UTC",
            "ObjectType": "SETTLEMENT",
            "Reason": "FIGHT",
            "SettlementStatus": "FAILED",
            "SettlementType": "FORCED",
            "Version": 1
        }
    }
] };

var source   = document.getElementById("template").innerHTML;
var template = Handlebars.compile(source);
document.getElementById("output").innerHTML = template(obj);

function deleteBill(bill) {
  console.log(bill);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.11/handlebars.js"></script>

<script id="template" type="text/x-handlebars-template">
First example (only direct access)
<div style="cursor:pointer; color:blue; text-decoration:underline;"
     onclick="reSettle('{{Data.0.settleFight.ATransfers.0.ID}}');">Resettle {{Data.0.settleFight.ATransfers.0.ID}}</div> 


Second example (mix with each and direct access)
{{#each Data}}
   <div style="cursor:pointer; color:blue; text-decoration:underline;"
     onclick="reSettle('{{settleFight.ATransfers.0.ID}}');">Resettle {{settleFight.ATransfers.0.ID}}</div> 
{{/each}}

Second example (only each loops):
{{#each Data}}
  {{#each settleFight.ATransfers}}
   <div style="cursor:pointer; color:blue; text-decoration:underline;"
     onclick="reSettle('{{ID}}');">Resettle {{ID}}</div> 
  {{/each}}
{{/each}}
</script>

<div id="output"></div>

关于javascript - 当我从 Handlebars 返回一个值时,我正在获取作为对象的值。如何获得内在值(value),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50168939/

相关文章:

javascript - 无法在 Handlebars 中使用 if 条件

javascript - Handlebars.js:渲染大数据而不阻塞 UI – 使用 setTimeout() 延迟或延迟加载?

javascript - Ember.js 模板内模式将变量传递给传递的操作(上下文组件)

javascript - 如何解析/解析属性名称中包含多个单词的 JSON 对象 - JavaScript

node.js - jsdom表单提交?

javascript - 检查数组是否包含javascript中的null以外的内容?

javascript - 获取随机 Discord 用户

javascript - 使用 .html#link 突出显示网站部分

c# - 如何使用 .NET 的 WebBrowser 或 mshtml.HTMLDocument 动态生成 HTML 代码?

javascript - 通过单击外部关闭 Bootstrap offcanvas 侧边栏