0

jQueryでhandlebars.jsを使用して辞書のトップレベルの配列を処理する方法を理解するのに苦労しています

私のデータオブジェクトは、名前付き配列オブジェクトを持つディクショナリで構成されていません（オンラインのほとんどの例が扱っています）。私のデータオブジェクトは次のようになります。

[
  {
    "Type": "TopLevel",
    "Identifier": "123456789IL",
    "FullName": "Smith, John H.",
    "CurrentLocation": "In Building"
  },
  {
    "Type": "TopLevel",
    "Identifier": "123456789OL",
    "FullName": "Doe, Jane M.",
    "CurrentLocation": "Parking Lot"
  }
]

これは、動作中のjsfiddle（名前付き配列オブジェクト（私が持っていない）を使用）と、実際のデータオブジェクトを使用した非動作jsfiddle（動作しません）です。

http://jsfiddle.net/eljaywilson/ZhF5h/ - 動作しますが、データ オブジェクトの外観は異なります

http://jsfiddle.net/eljaywilson/ZhF5h/1/ - うまくいかない

4

2 に答える 2

2

テンプレートにエラーがあります。次のように [/users] を {{/.}} に変更する必要があります。

    <tbody> 
        {{#.}}
        <tr> 
            <td>{{Type}}</td> 
            <td>{{FullName}}</td> 
            <td>{{CurrentLocation}}</td> 
            <td>{{Identifier}}</td> 
        </tr> 
        {{/.}}
    </tbody>
于 2013-12-23T15:50:54.933 に答える
1

これで問題が解決するはずです：

var source = $("#some-template").html(); 
var template = Handlebars.compile(source); 

var data =  [
  {
    "Type": "TopLevel",
    "Identifier": "123456789IL",
    "FullName": "Smith, John H.",
    "CurrentLocation": "In Building"
  },
  {
    "Type": "TopLevel",
    "Identifier": "123456789OL",
    "FullName": "Doe, Jane M.",
    "CurrentLocation": "Parking Lot"
  }
]
; 

Handlebars.registerHelper('fullName', function(person) {
  return person.firstName + " " + person.lastName;
});

$('#myDiv').append(template({ users: data }));

説明：

data は配列であり、テンプレートに渡す前にラップするだけです。

固定された jsfiddle はこちら: http://jsfiddle.net/akhikhl/bTzf3/1/

于 2013-12-23T15:50:19.510 に答える