вложенные данные extjs не отображаются в сетке привязки данных - PullRequest
Новая
       21

вложенные данные extjs не отображаются в сетке привязки данных

0 голосов
/ 30 января 2019

Как мне связать данные в моей сетке extjs6, чтобы включить "комиссию", используя следующий формат, который я создал из webapi ef?

столбцы сетки должны выглядеть следующим образом. 

title: 'Commissions',
xtype: 'grid',
bind: {
store: '{myAccountDetails.commission}'
},
ui: 'featuredpanel-framed',
cls: 'custom-grid',
margin: '0 0 0 0',
itemId: 'gridCommId',
collapsible: true,
columns: [
{
header: 'USD',
dataIndex: 'usd',
flex: 1
},
{
header: 'AUD',
dataIndex: 'aud',
flex: 1
},
{
header: 'CAD',
dataIndex: 'cad',
flex: 1
}

screenshot Это мой вид сетки

скриншот, который я прикрепил: myAccountDetails

любая помощь будет принята с благодарностью!

просто sidenote ... еслиЯ добавляю ярлык и могу вернуть информацию, которую ищу, но хочу, чтобы она была внутри сетки. 

                    xtype: 'label',
                    cls: 'myLabelCRM2',
                    bind: {
                        text: '{myAccountDetails.commission.aud}'
                    }

1 Ответ

0 голосов
/ 30 января 2019

Лучший подход - определить хранилище в viewmodel и связать его поле данных непосредственно с полем ввода данных с использованием синтаксиса усов. 

Ext.define('MyView', {
    viewModel: {
        data: {
            myAccountDetails: {
                accountName: 'foo',
                commision: {
                    aud: 7,
                    cad: 8,
                    usd: 9
                }
            }
        },
        stores: {
            commisionStore: {
                fields: ['aud', 'cad', 'usd'],
                data: '{myAccountDetails.commision}'
            }
        }
    },

    extend: 'Ext.grid.Panel',
    xtype: 'MyView',
    bind: {
        store: '{commisionStore}'
    },
    columns: [{
        header: 'USD',
        dataIndex: 'usd',
        flex: 1
    }, {
        header: 'AUD',
        dataIndex: 'aud',
        flex: 1
    }, {
        header: 'CAD',
        dataIndex: 'cad',
        flex: 1
    }]
});

Ext.application({
    name: 'Fiddle',

    launch: function () {
        Ext.create({
            xtype: 'MyView',
            width: 300,
            height: 300,
            renderTo: Ext.getBody()
        });
    }
});
...