Sencha Touch2：无法解析商店内的 Json 文件答案

【问题标题】：Sencha Touch2: cannot Parse Json file inside storeSencha Touch2：无法解析商店内的 Json 文件
【发布时间】：2013-03-19 16:50:32
【问题描述】：

我是 Sencha Touch2 的新手。从 Json 文件加载嵌套数据时遇到问题。这是我的 json 文件：

{
   "html_attributions" : [
      "Listings by \u003ca href=\"http://www.yellowpages.com.au/\"\u003eYellow Pages\u003c/a\u003e"
   ],
   "results" : [
      {
         "geometry" : {
            "location" : {
               "lat" : -33.8711140,
               "lng" : 151.1990420
            }
         },
         "icon" : "http://maps.gstatic.com/mapfiles/place_api/icons/travel_agent-71.png",
         "id" : "ddd678ac0a16d83fdc25500ccb3d6aa27b7f5548",
         "name" : "Darling Harbour",
         "photos" : [
            {
               "height" : 1088,
               "html_attributions" : [
                  "\u003ca href=\"https://plus.google.com/117001986278088134060\"\u003eStephen SteveT\u003c/a\u003e"
               ],
               "photo_reference" : "CnRiAAAAyl02-KJEBTh19Pc4YuOhMn0DPYLCat_1HMSwX_icBwgyjWr7QGkT262oE57hMlOUypibloD1oFwxBJ8Iq3oJCLKBNXcyAmw7000P91LblItAcxuVyvltfRggSLwT36pooEmZiKITyEuwAmpKpGrxhRIQhyMbZ-cHFI6zSayNRRiH_BoUgWH-2M6mR1IO9MuftuuYkZRHUZ4",
               "width" : 1600
            }
         ],
         "rating" : 4.30,
         "reference" : "CnRtAAAAmNBHFs0qF9UJEw1NccjMySkm4aH3cEL6cCkLj-V4rkDJJE81-fFOar6PAtoK5d70GLJTgh_LcpysxH41iRI4hW3YreiPI66GBJYEeWA6SbgNQrJy6RbTw7LbhB6vYb3gfzpV2lE6fUtaIjx3WOLjsBIQVjFdJTUy55L1fzdzyufUaBoU194V7aIidzGbj7aRUaObJdl5GvM",
         "types" : [ "travel_agency", "cafe", "restaurant", "food", "establishment" ],
         "vicinity" : "Sydney"
      },
      {
         "geometry" : {
            "location" : {
               "lat" : -33.870540,
               "lng" : 151.1988150
            }
         },.........

这里可以获取图标、id、名称的数据。我跟着一个教程。但是我如何读取“lat”和“lng”的“位置”内的数据。下面是我的店铺。

Ext.define('CustomList.store.StoreList', {
    extend:'Ext.data.Store',
    requires:['Ext.data.reader.Json','Ext.data.proxy.JsonP'],
    config:{
        model:'CustomList.model.ModelList',
        autoLoad:'true',
        proxy:{
            type:'ajax',
       url:'http://localhost:9091/Json/sample.json',

            reader:{
                type:'json',
                rootProperty:'results'
                }
        }
    }
});

这是我的模型：

Ext.define('CustomList.model.ModelList', {
    extend: 'Ext.data.Model',
    config: {
        fields:['geometry.location.lat','geometry.location.lng']

    }})

这是我的清单： ShowList.js：

Ext.define('CustomList.view.ShowList',{
    extend:'Ext.Panel',
    xtype:'showList',
    config:{
        layout:'fit',
        styleHtmlContent:'true',
        styleHtmlCls:'showListCls',
        items:[
            {
                xtype:'list',
                id: 'listitems',
                store:'StoreList',
//                itemTpl:'{id},{name},{vicinity}'
                itemTpl:'{modelList.geometry.location.lat} {modelList.geometry.location.lng}'

               }]


    }
});

谁能帮帮我。谢谢。

【问题讨论】：

标签： json sencha-touch-2

【解决方案1】：

来自documentation

rootProperty : String 包含行对象数组。对于 JSON 阅读器，它是点分隔的列表属性名称。

在您的代码中，您将rootProperty 设置为geometry，所以我猜读者会认为所有数据都在第一个geometry 属性中。

一种解决方案是将rootProperty 设置为results，将模型的field 配置设置为fields:['geometry']，然后像这样访问lat 和lng

yourModelInstance.geometry.location.lat;
yourModelInstance.geometry.location.lng;

希望对你有帮助

【讨论】：

我已按照您的建议进行操作，但出现错误。我已经更新了代码并添加了 showList.js 供您参考。谢谢。
rootProperty:'results.geometry.location' 应该是 rootProperty:'results' 和 fields:['lat','lng'] 应该是 fields:['geometry']
获取 [Ext.XTemplate#apply] 错误：无法读取未定义的属性“几何”。能否请您更新代码。谢谢。
itemTpl 应该是 itemTpl:'{geometry.location.lat} {geometry.location.lng}'
现在出现错误：无法读取未定义的属性“位置”。