在sencha touch 2中解析xml

时间:2013-05-26 12:04:26

标签: xml-parsing sencha-touch-2

我想使用sencha touch解析xml,我已经尝试了stckovrflow中的所有可能性,但没有显示:

XML数据: 来自:http://www.aufaitmaroc.com/feeds/maroc.xml

商店:

 Ext.define("MyApp2.store.NewsStore", {
 extend: "Ext.data.Store",
 requires: ["Ext.data.proxy.JsonP", "Ext.dataview.List", "MyApp2.model.News"           ,"Ext.data.reader.Xml"],
config: {
model: "MyApp2.model.News",
autoLoad: true,
proxy: {
    type: 'jsonp',
    url: 'http://www.aufaitmaroc.com/feeds/maroc.xml',
    reader: {
        type: 'xml',
        record: 'item',
        rootProperty: 'channel'
        }
    }
}    
});

我的模特:

Ext.define("MyApp2.model.News", {
extend: "Ext.data.Model",
config: {
type:'tree',
fields: [
{name: 'title', type: 'auto'}

 ]
  } 
   });

我的观点:

 {
                    xtype: "list",
                    store: "NewsStore",
                    itemTpl: '<h1>{title}</h1>'
 }

我在chrome的控制台中出现了这个错误:

Picture from my browser

我试图解决我的问题: 我在apache的HTTPD.conf中添加了这个(我使用的是WampServer)

    AddType application/x-font-woff .woff
    AddType application/rss+xml .xml

我创建了:httpd-proxy.conf并将其放在额外文件夹

我的httpd-proxy.conf

 ProxyRequests Off
 ProxyPreserveHost On

<Proxy *>
Order deny,allow
Allow from all
</Proxy>

ProxyPass /EMBackend http://localhost:8383/MyApp2/index.html
ProxyPassReverse /EMBackend http://localhost:8383/MyApp2/index.html
<Location /EMBackend>
    Order allow,deny
    Allow from all
 </Location>

我已将此添加到httpd.conf:

 Include conf/extra/httpd-proxy.conf

&安培; stil无法显示任何数据。任何帮助将不胜感激:)

Ps:我试着像这样使用JsonP:

       proxy: {
    type: 'jsonp',
     url: 'https://ajax.googleapis.com/ajax/services/feed/load?         v=1.0&q=http://www.aufaitmaroc.com/feeds/maroc.xml',
    reader: {
        type: 'json',
        rootProperty: 'responseData.feed.entries'
        }
    }

我没有得到所有数据,你可以尝试将网址放入浏览器。

1 个答案:

答案 0 :(得分:2)

AFAIK JSONP不适用于xml。您将需要使用像yql这样的服务将xml转换为json。 This fiddle is demo of doing that

Ext.define('MyApp.model.Station', {
    extend: 'Ext.data.Model',
    config: {
        fields: [
            'title'
        ]
    }
});

Ext.define('MyApp.store.Stations', {
    extend: 'Ext.data.Store',
    requires: 'MyApp.model.Station',
    config: {
        autoLoad: true,
        model: 'MyApp.model.Station',
        proxy: {
            type: 'jsonp',
            //url    : 'http://www.aufaitmaroc.com/feeds/maroc.xml',
            url: 'http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20rss%20where%20url%20%3D%20%22http%3A%2F%2Fnews.google.co.in%2Fnews%3Fpz%3D1%26cf%3Dall%26ned%3Din%26hl%3Den%26output%3Drss%22&format=json&diagnostics=true',
            reader: {
                type: 'json',
                rootProperty: 'query.results.item'
            }
        }
    }
});

Ext.define('MyApp.list.List', {
    extend: 'Ext.List',
    config: {
        fullscreen: true,
        itemTpl: '{title}',
        store: Ext.create('MyApp.store.Stations')
    }
});

Ext.create('MyApp.list.List');

使用YQL, 转到yql控制台页面 - http://developer.yahoo.com/yql/console/

在“YQL语句”框中键入以下行。 'select * from rss where url =“http://www.aufaitmaroc.com/feeds/maroc.xml”'

在下面的单选按钮中选择json选项

清除单选按钮侧面的输入框。它应该是空的。

取消选中'diagnostic'和'debug'复选框。

然后按“测试”按钮。这应该给你下面的输出。

现在完成所有这些后,请转到页面底部。应该有'THE REST QUERY'部分。 有一个网址。请注意,在网址的末尾会有类似“&amp; callback =”的内容。删除它,并使用剩余的作为商店的URL。 url的回调部分由sencha自动处理。