Sencha touch2: How can i parse my nested json data?

问题

i could not able to parse my nested json data and i tried in many ways but i could not succeed. any help is appreciated. Here is my json output looks like:

[
  {
    "task": {
      "locator": "FGWESD",
      "subtask": [
        {
          "work": {
            "number": "1145",
            "id": "0",
            "status": true,
            "gate": "N\/A",
            },
          "sequenceNumber": "0",
          "id": "0"
        },
        {
          "work": {
            "number": "1145",
            "id": "0",
            "status": true,
            "gate": "N\/A",
          },
          "sequenceNumber": "0",
          "id": "0"
        }
      ],
      "connectTime": "0",
      "id": "0"
    }
  }
]

Here is my model:

Ext.define('MyApp.model.MyModel',{
    extend:'Ext.data.Model',
    xtype:'myModel',
    config:{
        fields:[
        {name:'number',mapping:'work.number'},
        {name:'id',mapping:'work.id'},
        {name:'locator',mapping:'task.locator'},
        {name:'gate',mapping:'work.gate'}

        ]
    }
});

Here is the store:

Ext.define('MyApp.store.StoreList', {
    extend:'Ext.data.Store',
     config:{
        model:'MyApp.model.MyModel',
        storeId: 'id_Store',
// added the url dynamically inside the controller
        proxy:{
            type:'ajax',
            reader:
            {
                type:"json",
                rootProperty: 'subtask'
            },
            method: 'POST',
            actionMethods: {
                create : 'POST',
                read   : 'POST', // by default GET
                update : 'POST',
                destroy: 'POST'
            },
            headers :{
                "Content-Type" :'application/xml',
                'Accept':'application/json'
            }

        }
    }
});

Here is my controller code :

    Ext.define('MyApp.controller.LoginController', {
        extend: 'Ext.app.Controller',
        requires: ['Ext.data.proxy.Rest'],

        config: {
// My code is too long to add here so am adding store loading when user taps login button

},
  getDetails: function(){
        var segmentStore = Ext.create('MyApp.store.StoreList');
        var url = 'http://localhost:8080/apps';
        segmentStore.getProxy().setUrl(url.trim());
        segmentStore.load({
                   scope:this,
                    callback: function(records, operation, success){
                        if(success){
                           console.log('records: ',records);

                           console.log('records: '+records.length); // prints here 1
                          console.log('locator: '+records[0].getData().locator);
// prints FGWESD
                          console.log('locator: '+records[0].getData().number);
//prints undefined
// 
                        }
}
            }
        )
    },
});

Can any one please help me out. how can i get Values of number, gate, id and status? What are the necessary changes have to be made in model, store and controller ? Please help me out in resolving ? Thanks.

回答1:

As I wrote in a comment, I don't think you can achieve that without manually parsing the data and loading it to the store. So the getDetails function should look like this:

getDetails: function(){
    var segmentStore = Ext.create('MyApp.store.StoreList');
    Ext.Ajax.request({
        url: 'http://localhost:8080/apps',
        success: function(response){
            var responseObj = Ext.decode(response.responseText);
            var task = responseObj[0].task;
            var locator = task.locator;
            var subtasks = [];
            Ext.each(task.subtask, function(subtask) {
                subtasks.push({
                    number: subtask.work.number,
                    id: subtask.work.id,
                    gate: subtask.work.gate,
                    locator: locator
                });
            });
            segmentStore.setData(subtasks);
        }
    });
}

Also, when using this method you should remove the mapping from your model, and you can get rid of the proxy definition of the store. Also, I'm not sure why you want to create the store in the "getDetails" and not define it in the 'stores' config of the controller, but maybe you have your reasons.. I didn't run the code, so there maybe errors, but I hope you get the idea.

回答2:

I think the root property of your store should be:

rootProperty: 'task.subtask'

来源：https://stackoverflow.com/questions/16968734/sencha-touch2-how-can-i-parse-my-nested-json-data