Extjs 5,数据模型关联&加载嵌套数据

时间:2015-01-25 19:14:46

标签: javascript extjs extjs5

试图让这项工作......

我想在两个对象模型上加载嵌套数据

Ext.application({
name : 'MyApp',

launch : function() {


    Ext.define('MyApp.model.Address', {
        extend: 'Ext.data.Model',

        entityName: 'Address',

        fields: [ 

            {
                name: 'id',
                type: 'int'
            },
            {
                name: 'addressLine',
                type: 'string'
            },
            {
                name: 'city',
                type: 'string'
            },
            {
                name: 'created',
                type: 'date',
                dateFormat: 'time',
                persist: false
            }
        ]
    });


    Ext.define('MyApp.model.User', {
        extend: 'Ext.data.Model',

        entityName: 'User',

        fields: [ 
            {
                name: 'id',
                type: 'int'
            },
            {
                name: 'address',
                reference: 'Address'
            },
            {
                name: 'name',
                type: 'string'
            },
            {
                name: 'lastname',
                type: 'string'
            },
            {
                name: 'created',
                type: 'date',
                dateFormat: 'time',
                persist: false
            }
        ]
    });


    var user = new MyApp.model.User({
        "id": 1,
        "name": "Pedro",
        "lastname": "Carbonell",
        "address": {
            "id": 1,
            "addressLine": "Bailen 22",
            "city": "Barcelona",
            "created": 1420668866000
        },
        "created": 1420668866000
    });        

    console.info(user);
    console.info(user.getAddress());

}});

创建用户时没有错误,但是当我通过user.getAddress()访问关联数据时,它返回了一个异常:

 Uncaught Error: The model ID configured in data ("[object Object]") has been rejected by the int field converter for the id fieldext-all-debug.js

尝试在模型定义上定义代理,如内存或localstorage,但结果是相同的。

Ext fiddle:https://fiddle.sencha.com/#fiddle/h2d

任何帮助将不胜感激!

4 个答案:

答案 0 :(得分:3)

解决了,但只找到了这个解决方案:当使用loadRawData ...

    var store = new Ext.data.Store({
        model: MyApp.model.User
    });

    store.loadRawData({
        "id": 1,
        "name": "Pedro",
        "lastname": "Carbonell",
        "address": {
            "id": 1,
            "addressLine": "Bailen 22",
            "city": "Barcelona",
            "created": 1420668866000
        },
        "created": 1420668866000
    });        

    console.info(store.first());
    console.info(store.first().getAddress());

这个新小提琴的样本:https://fiddle.sencha.com/#fiddle/h4e

你是对的,ext有点片状,非常......

答案 1 :(得分:1)

我一直在玩你的小提琴中的代码,但是还没有能够以正式的方式使用该协会。

我使用此代码模拟了功能:

Ext.define('MyApp.model.User', {
        extend: 'Ext.data.Model',

        fields: [{
            name: 'id',
            type: 'int'
        }, {
            name: 'name',
            type: 'string'
        }, {
            name: 'lastname',
            type: 'string'
        }, {
            name: 'created',
            type: 'date',
            dateFormat: 'time',
            persist: false
        }],

        getAddress: function() {
            if ('undefined' === this.data.address) {
                return null;
            }
            return Ext.create('Address', this.data.address);
        }
    });

基本上我已经删除了关联并创建了一个自定义函数来根据传入的原始数据创建模型记录。如果地址数据不存在而不是null,您还可以返回一个新的空模型,我使用null,因为它更容易确定你是否有一个有效的地址记录。

正如已经提到的 - 这不是官方的做法,我会再次玩弄小提琴,并在找到后发布更好的解决方案,这可能有助于此期。

答案 2 :(得分:1)

使用原始代码,我做了一些修改,现在它似乎正在运行。

Ext.application({
name : 'MyApp',

launch : function() {


    Ext.define('MyApp.model.Address', {
        extend: 'Ext.data.Model',

        //entityName: 'Address',

        fields: [ 

            {
                name: 'id',
                type: 'int'
            },
            {
                name: 'addressLine',
                type: 'string'
            },
            {
                name: 'city',
                type: 'string'
            },
            {
                name: 'created',
                type: 'date',
                dateFormat: 'time',
                persist: false
            }
        ],

        hasMany: 'User'
    });


    Ext.define('MyApp.model.User', {
        extend: 'Ext.data.Model',

        //entityName: 'User',

        fields: [ 
            {
                name: 'id',
                type: 'int'
            },
            {
                name: 'name',
                type: 'string'
            },
            {
                name: 'lastname',
                type: 'string'
            },
            {
                name: 'created',
                type: 'date',
                dateFormat: 'time',
                persist: false
            }
        ], 

        hasMany: { model: 'Address', name: 'Address' }
    });


    var user = new MyApp.model.User({
        "id": 1,
        "name": "Pedro",
        "lastname": "Carbonell",
        "address": {
            "id": 1,
            "addressLine": "Bailen 22",
            "city": "Barcelona",
            "created": 1420668866000
        },
        "created": 1420668866000
    });        

    console.info(user);
    console.info(user.data.address);

}
});

答案 3 :(得分:1)

这是你之后的事吗?我在用户模型上手动设置地址。不理想,但它被正确地解释为记录。

    Ext.define('MyApp.model.Address', {
        extend: 'Ext.data.Model',

        entityName: 'Address',

        fields: [ 

            {
                name: 'id',
                type: 'int'
            },
            {
                name: 'addressLine',
                type: 'string'
            },
            {
                name: 'city',
                type: 'string'
            },
            {
                name: 'created',
                type: 'date',
                dateFormat: 'time',
                persist: false
            }
        ]
    });


    Ext.define('MyApp.model.User', {
        extend: 'Ext.data.Model',

        entityName: 'User',

        fields: [ 
            {
                name: 'id',
                type: 'int'
            },
            {
                name: 'addressId',
                reference: 'Address'
            },
            {
                name: 'name',
                type: 'string'
            },
            {
                name: 'lastname',
                type: 'string'
            },
            {
                name: 'created',
                type: 'date',
                dateFormat: 'time',
                persist: false
            }
        ]
    });


    var user = new MyApp.model.User({
        "id": 1,
        "name": "Pedro",
        "lastname": "Carbonell",
        "created": 1420668866000
    });        

    var addr  = new MyApp.model.Address({
            "id": 1,
            "addressLine": "Bailen 22",
            "city": "Barcelona",
            "created": 1420668866000
    });
    user.setAddress(addr);
    console.info(user);
    console.info(user.getAddress());