Extjs 5，数据模型关联和加载嵌套数据

Question

我正在尝试使这个工作起来...

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

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

尝试在模型定义中定义代理，如内存或本地存储，但结果是相同的。

Ext示例：https://fiddle.sencha.com/#fiddle/h2d 任何帮助将不胜感激！

- Manu

Answer 1

已解决，但只发现这个解决方案：当使用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有点不稳定，非常......

- Manu

Answer 2

这是您想要的吗？我在用户模型上手动设置了地址。虽然不是理想的方法，但它被正确地解释为一条记录。

    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());

- Jasmine Cee

Answer 3

我一直在尝试使用你的代码片段，并且目前还无法按照官方方法使关联起作用。

我使用以下代码模拟了该功能：

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是因为更容易确定是否有有效的地址记录。

正如已经提到的 - 这不是官方的做法，我将再玩一下fiddle，并找到更好的解决方案后发布，这可能会在此期间有所帮助。

- Scriptable

---

是的，非常感谢，这个解决方案对我很有用，但我想了解为什么官方的方法不起作用。 - Manu

我仍在调查中，说实话，ExtJs的关联有点不稳定，或者至少很难适应，只需看看关于它们的所有帖子此处。我将在获得更多信息时更新答案。它似乎不喜欢您在两个上都使用id:的事实，我将地址更改为addressId，它已经通过了该错误，但仍未加载数据。 - Scriptable

问题已解决，但只有在使用loadRawData时才能解决...您可以在这个新的fiddle中看到：https://fiddle.sencha.com/#fiddle/h4e...你说得对，ext有点不稳定，非常...... - Manu

Answer 4

使用原始代码，我进行了一些修改，现在它似乎可以正常工作。

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);

}
});

- Greg Ellingboe

---

似乎无法正常工作，此代码没有生成任何关联...您正在访问未解析的原始对象'user.data.address'。请查看user.data.address.created（它没有像user.get('created')一样解析为日期对象...没有生成关联（您无法通过user.getAdress（）.get（'created'）进行访问...）。感谢您的尝试。 - Manu