车把在每个标记之外绑定答案

【问题标题】：Handlebars bind outside each in markup车把在每个标记之外绑定
【发布时间】：2018-09-09 07:37:15
【问题描述】：

在标记中每个“sectorsPressCoverageElements”之外的把手中绑定对象时遇到问题。这是我的 json 数据：

{
  "name": "Rassegna",
  "page": 1,
  "pages": 7,
  "sectorsPressCoverageElements": [
    {
      "id": 25129,
      "media": "media",
      "linkMedia": "",
      "article": "article",
      "journalist": "",
      "linkJournalist": "",
      "publishingDate": "2017-11-23T09:00:00",
      "purchase": false
    },
    {
      "id": 25129,
      "media": "media",
      "linkMedia": "",
      "article": "article",
      "journalist": "",
      "linkJournalist": "",
      "publishingDate": "2017-11-23T09:00:00",
      "purchase": false
    }
  ],
  "categories": [
  ],
  "error": null
}

我的问题是绑定在每个之外的“名称”。这是我的区域标记以将“数据名称”与名称绑定（例如在 json 中：“名称”：“Rassegna”）：

<script id="handlePressCoverage" type="text/x-handlebars-template">
    {{#each sectorsPressCoverageElements}}
    <tr data-id="{{id}}" data-category="0">
        @*<td> <input type="checkbox" class="select-element"></td>*@
        <td class="col-xs-2">{{#simplifyDate publishingDate}}{{/simplifyDate}}</td>    
            <text>
                <td class="col-xs-1"><button data-id="{{id}}" data-name="{{HOW BIND NAME HERE??}}" class="btn btn-success btn-xs iPressShare">Save &nbsp<i class="iPressIconShare fas fa-share-alt"></i></button></td>
            </text>
    </tr>
    {{/each}}
</script>

并将数据传递给车把：

var sourcePressCoverage = $("#handlePressCoverage").html();
var templatePressCoverage = Handlebars.compile(sourcePressCoverage);
           $.getJSON(url, function (data) {    
                $htmlsourcePressCoverage = $(templatePressCoverage(data));              
           });

【问题讨论】：

标签： javascript json handlebars.js each bind

【解决方案1】：

要绑定each之外的name，可以在Handlebar中使用../ segments。这将根据父上下文评估它们的路径。

例如，在您的情况下，只需将 ../name 放在 data-name 属性中将导致 Rassegna

<script id="handlePressCoverage" type="text/x-handlebars-template">
{{#each sectorsPressCoverageElements}}
<tr data-id="{{id}}" data-category="0">
    @*<td> <input type="checkbox" class="select-element"></td>*@
    <td class="col-xs-2">{{#simplifyDate publishingDate}}{{/simplifyDate}}</td>    
        <text>
            <td class="col-xs-1"><button data-id="{{id}}" data-name="{{../name}}" class="btn btn-success btn-xs iPressShare">Save &nbsp<i class="iPressIconShare fas fa-share-alt"></i></button></td>
        </text>
</tr>
{{/each}}

【讨论】：

正确的绑定是 data-name="{{../name}}" 。非常感谢！
为了使这篇文章更完整，即使您想在标记中绑定两个不同的数据 json，是否有解决方案？非常感谢