在 XTemplate 中加载关联的模型数据

Posted 2023-04-12

【中文标题】在 XTemplate 中加载关联的模型数据

【英文标题】：Loading associated model data in XTemplate

【发布时间】：2013-10-02 15:20:14

【问题描述】：

这两天我搜索了很多，但找不到解决方案。这是我的问题的描述：

我有一个 Sencha Touch 应用程序，其中包含一个简单的列表作为视图、2 个模型（CartItem 和 Article）和 2 个相应的商店（CartItems 和 Articles）。

CartItem 模型具有与 Article 模型的“hasOne”关联。

列表视图应显示所有 CartItems 以及相关文章的描述。

应该不会那么难吧？一般来说，这些协会确实有效，我通过以下方式获得了文章描述：

> Ext.getStore('cartItemStore').getAt(0).getArticle().get('description')
"Example article 1"

但我无法在我的列表中显示此描述。

我已经尝试过的是使用

  1) <tpl for="Article">description</tpl>
     -> doesn't display anything. Neither data nor an error.
  2) Article.description
     in combination with:
     http://appointsolutions.com/2012/07/using-model-associations-in-sencha-touch-2-and-ext-js-4/
     -> f***ed up my whole storage-system :/

那么有什么想法可以在我的模板中显示相关数据吗？如果有人能找到解决方案，我将非常感激！这是一个最小的代码示例：

Main.js

Ext.define('assoTempl.view.Main', 
    extend: 'Ext.dataview.List',
    xtype: 'main',
    config: 
        store: 'cartItemStore',
        scrollable: 'vertical',
        itemTpl: '<span>cart_pos <tpl for="Article">description</tpl></span>'
    
);

CartItem.js（CartItem 模型）

Ext.define('assoTempl.model.CartItem', 
    extend: 'Ext.data.Model',

    config: 
        fields: [
             name: 'cart_pos',
             name: 'article_id'
        ],
        proxy: 
            type: 'memory'
        ,
        hasOne: 
            model: 'assoTempl.model.Article',
            name: 'Article',
            foreignKey: 'ANr',
            foreignStore: 'ArticleStore'
        
    
);

Article.js（文章模型）

Ext.define('assoTempl.model.Article', 
    extend: 'Ext.data.Model',

    config: 
        fields: [
             name: 'ANr', type: 'int' ,
             name: 'description', type: 'String' 
        ],
        proxy: 
            type: 'memory'
        
    
);

CartItems.js（CartItem 商店）

Ext.define("assoTempl.store.CartItems", 
    extend: "Ext.data.Store",
    requires: ['Ext.data.proxy.Sql'],
    config: 
        storeId: 'cartItemStore',
        model: "assoTempl.model.CartItem",
        data: [
            cart_pos:0, article_id:0,
            cart_pos:1, article_id:1
        ],
        autoLoad: true
    
);

Articles.js（文章商店）

Ext.define("assoTempl.store.Articles", 
    extend: "Ext.data.Store",
    requires: ['Ext.data.proxy.Sql'],
    config: 
        storeId: 'articleStore',
        model: "assoTempl.model.Article",
        data: [
            ANr:0, description:'Example article 1',
            ANr:1, description:'I am article 2'
        ],
        autoLoad: true
    
);

【参考方案1】：

天啊，打扰了。没有人说我必须执行

cartItem.setArticle(myArticle);

在我可以访问该协会之前。 -.-