无法调用未定义的 handlebars.js 的方法“匹配”

Question

我正在尝试在 php 中使用 handlebars.js。我正在抓取通过 $_GET 传递的变量，构建一个数组，然后将其附加到 http://my.service.url.comsearch.json?。 http_build_query($myarray, '', "&"); 构建我的网址，然后使用 file_get_contents 获取“json”。我正在尝试使用 handlebars.js 来显示结果。我在 google chrome 控制台中收到以下错误

“未捕获的类型错误：无法调用未定义的方法'匹配' cloud.github.com/downloads/wycats/handlebars.js/handlebars-1.0.rc.1.js:431"

在控制台中查看错误的详细信息时，我看到了这个

lexer.next cloud.github.com/downloads/wycats/handlebars.js/handlebars-1.0.rc.1.js:431 法 cloud.github.com/downloads/wycats/handlebars.js/handlebars-1.0.rc.1.js:468 法 cloud.github.com/downloads/wycats/handlebars.js/handlebars-1.0.rc.1.js:238 解析 cloud.github.com/downloads/wycats/handlebars.js/handlebars-1.0.rc.1.js:251 Handlebars.parse cloud.github.com/downloads/wycats/handlebars.js/handlebars-1.0.rc.1.js:595 编译 cloud.github.com/downloads/wycats/handlebars.js/handlebars-1.0.rc.1.js:1842 （匿名函数） cloud.github.com/downloads/wycats/handlebars.js/handlebars-1.0.rc.1.js:1851 （匿名函数）profile.php:39

这是我正在使用的模板

 <script id="ul" type="text/x-handlebars-template">
  <ul>
    {{#jsonResult}}
      <li>{{name}}</li>
    {{/jsonResult}}
  </ul>
  </script>

这是我在尝试使用模板时使用的脚本

</script>
  <script type="text/javascript">
  var source = $("ul").html();
  var template = Handlebars.compile(source);
  var json = $pJSON;
  var data1 = JSON.stringify(json);
  var data = JSON.parse(data1);
  $("body").html(template(data));
</script>

这是“$("body").html(template(data));”上方控制台错误中引用的第 39 行

最后这是我得到的 json（以及一个示例）

{totalCount:2,jsonResult:[{listingId:460880,pageUrl:/page/LA/laplace/la-carreta-of-laplace/17-460880.html,name:La Carreta Of LaPlace，电话：(985) 651-9991，地址：107 Carrollwood Dr,city:Laplace,state:LA,url:http://www.carretarestaurant.com,latitude:30.44437,longitude:-91.14768,logoUrl:http://url.com/imp/17/logo/LG460880.JPG ,enticerLine:\传统 墨西哥风味 美食\，照片：[{photoUrl:http://url.com/imp/17/photo/PH460880_1_S.jpg,photoDesc:},{photoUrl:http://url.com/imp/17/photo/PH460880_2_S. jpg,photoDesc:},{photoUrl:http://url.com/imp/17/photo/PH460880_3_S.jpg,photoDesc:},{photoUrl:http://url.com/imp/17/photo/PH460880_4_S. jpg,photoDesc:},{photoUrl:http://url.com/imp/17/photo/PH460880_5_S.jpg,photoDesc:},{photoUrl:http://url.com/imp/17/photo/PH460880_6_S. jpg,photoDesc:},{photoUrl:http://url.com/imp/17/photo/PH460880_7_S.jpg,photoDesc:},{photoUrl:http://url.com/imp/17/photo/PH460880_8_S. jpg,photoDesc:},{photoUrl:http://url.com/imp/17/photo/PH460880_9_S.jpg,photoDesc:},{photoUrl:http://url.com/imp/17/photo/PH460880_11_S. jpg,photoDesc:},{photoUrl:http://url.com/imp/17/photo/PH460880_12_S.jpg,photoDesc:}]},{listingId:430765,pageUrl:/page/LA/new-orleans/casa -garcia-mexican-restaurant/17-430765.html，名称：Casa 加西亚墨西哥餐厅，电话：(504) 464-0354，地址：，城市：新 Orleans,state:LA},{listingId:223993,pageUrl:/page/LA/metairie/casa-garcia-mexican-restaurant/17-223993.html,name:Casa 加西亚墨西哥餐厅，电话：(504) 467-4071，地址：8814 Veterans 纪念馆 Bl,city:Metairie,state:LA,latitude:30.005453,longitude:-90.224346},{listingId:115036,pageUrl:/page/LA/kenner/casa-tequila/17-115036.html,name:Casa 龙舌兰酒，电话：(504) 443-5423，地址：3229 Williams Bl,city:Kenner,state:LA,latitude:30.014789,longitude:-90.239894,displayAd:http://url.com/imp/17/disp/DA115036_658760_1.JPG,displayAds:[{displayAd:http://url .com/imp/17/disp/DA115036_658760_1.JPG}]},{listingId:460184,pageUrl:/page/LA/kenner/garces-latin-american-restaurant/17-460184.html,name:Garces 拉丁美洲餐厅，电话：(504) 305-5035，地址：4221 Williams Bl,city:Kenner,state:LA,url:http://www.garcescubanrestaurant.com,latitude:30.033075,longitude:-90.238324},{listingId:34172784,pageUrl:/page/LA/new-orleans/taco-贝尔新奥尔良/cg-34172784.html，名称：塔可 贝尔，电话：(504) 286-7901，地址：6220 Elysian Fields Ave，城市：New 奥尔良，州：LA，纬度：30.022314，经度：-90.061329，enticerLine：精打细算 家庭和旅行者为美国领先的炸玉米饼奔跑 链。},{listingId:34184616,pageUrl:/page/LA/new-orleans/taco-bell-new-orleans-5/cg-34184616.html,name:Taco 贝尔，电话：(504) 391-6930，地址：4300 General Degaulle Dr，城市：New 奥尔良，州：LA，纬度：29.919895，经度：-90.011082}，{listingId：672267490，pageUrl：/page/LA/new-orleans/taco-bell-new-orleans-4/cg-672267490.html，名称：塔可 贝尔，电话：(504) 283-9006，地址：4603 Chef Menteur Hwy，城市：New 奥尔良，州：LA，纬度：30.006073，经度：-90.035487}，{listingId：733204300，pageUrl：/page/LA/new-orleans/taco-bell-orleans-4/cg-733204300.html，名称：Taco 贝尔，电话：(504) 246-6699，地址：6007 Bullard Ave，城市：New 奥尔良，州：LA，纬度：30.043732，经度：-89.958962}，{listingId：733204270，pageUrl：/page/LA/new-orleans/taco-bell-orleans/cg-733204270.html，名称：Taco 贝尔,电话:(504) 244-8761,地址:5611 Read Blvd,city:New 奥尔良，州：LA，纬度：30.030747，经度：-89.97091}，{listingId：4431549，pageUrl：/page/LA/new-orleans/taco-bell-orleans-4/cg-4431549.html，名称：Taco 贝尔，电话：(504) 821-4458，地址：2639 Tulane Ave，城市：New 奥尔良，州：LA，纬度：29.96146，经度：-90.089724}，{listingId：733204280，pageUrl：/page/LA/new-orleans/taco-bell-orleans-2/cg-733204280.html，名称：Taco 贝尔，电话：(504) 240-6374，地址：6009 Bullard Ave，城市：New 奥尔良，州：LA，纬度：30.044695，经度：-89.959174}，{listingId：4415463，pageUrl：/page/LA/harvey/taco-bell-harvey/cg-4415463.html，名称：Taco 贝尔，电话：(504) 362-0746，地址：929 曼哈顿 Blvd，城市：Harvey，州：LA，纬度：29.902112，经度：-90.064841，enticerLine：预算有限 家庭和旅行者为美国领先的炸玉米饼奔跑 链。},{listingId:34159784,pageUrl:/page/LA/marrero/taco-bell-marrero-2/cg-34159784.html,name:Taco 贝尔，电话：(504) 341-5367，地址：5141 Lapalco Blvd,city:Marrero,state:LA,latitude:29.874902,longitude:-90.098789},{listingId:34141058,pageUrl:/page/LA/terrytown/taco-bell-terrytown/cg-34141058.html,name:Taco 贝尔，电话：(504) 394-7584，地址：2640 Belle Chasse Hwy,city:Terrytown,state:LA,latitude:29.888259,longitude:-90.030674},{listingId:612584560,pageUrl:/page/LA/harvey/taco-bell-harvey-3/cg-612584560.html,name:塔可 贝尔，电话：(504) 374-0972，地址：1740 曼哈顿 Blvd,city:Harvey,state:LA,latitude:29.88825,longitude:-90.056795},{listingId:708288570,pageUrl:/page/LA/gretna/taco-bell-gretna/cg-708288570.html,name:TACO BELL，电话：(504) 368-3370，地址：62 WESTBANK EXPY # B,city:GRETNA,state:LA,latitude:29.918798,longitude:-90.044141},{listingId:34183917,pageUrl:/page/LA/westwego/taco-bell-westwego/cg-34183917.html,name:Taco 贝尔，电话：(504) 341-6909，地址：1001 Westbank Expy,city:Westwego,state:LA,latitude:29.898329,longitude:-90.142391},{listingId:672876420,pageUrl:/page/LA/gretna/taco-party-gretna/cg-672876420.html,name:Taco 派对，电话：(504) 312-3912，地址：1115 van Trump St,city:Gretna,state:LA,latitude:29.918975,longitude:-90.045341},{listingId:647483470,pageUrl:/page/LA/westwego/speedy-taco-westwego/cg-647483470.html,name:Speedy Taco，电话：(504) 301-1524，地址：1020 Bridge City Ave,city:Westwego,state:LA,latitude:29.930096,longitude:-90.172423}]}

Answer 1

{{#jsonResult}}
  <li>{{name}}</li>
{{/jsonResult}}

#jsonResult 不会像您希望的那样遍历列表。你需要使用：

{{#each jsonResult}}
  <li>{{name}}</li>
{{/each}}

见http://handlebarsjs.com#iteration。

编辑：

您需要将var source = $("ul").html(); 更改为var source = $("#ul").html();