Model view controller 更新Sencha Touch MVC应用程序中的子面板

开发Sencha Touch MVC应用程序，从json存储中提取数据（设置为DB，从Wordpress博客中提取内容）

在我的“细节”面板之前，一切正常。与其听第三方物流，还不如倒一些数据。这些数据看起来与我的博客文章很相似，但却充满了其他代码，没有多大意义

以下是我清单的精简版本：

    myApp.views.PostListView = Ext.extend(Ext.Panel, {

    postStore: Ext.emptyFn,
    postList: Ext.emptyFn,
    id:'postlistview',
    layout: 'card',

    initComponent: function () {

       /* this.newButton = new Ext.Button({
            text: 'New',
            ui: 'action',
            handler: this.onNewNote,
            scope: this
        });*/

        this.topToolbar = new Ext.Toolbar({
            title: 'All Posts',
           /* items: [
                { xtype: 'spacer' },
                this.newButton
            ],*/
        });


        this.dockedItems = [ this.topToolbar ];

        this.postList = new Ext.List({
            store: myApp.stores.postStore,
            grouped: true,
            emptyText: '<div style="margin:5px;">No notes cached.</div>',
            onItemDisclosure: true,
            itemTpl: '<div class="list-item-title">{title}</div>' +
                            '<div class="list-item-narrative"><small>{body}</small></div>',

        });

        this.postList.on('disclose', function (record) {
            this.onViewPost(record);
        }, this),

        this.items = [this.postList];

        myApp.views.PostListView.superclass.initComponent.call(this);
    },
    onViewPost: function (record) {
        Ext.dispatch({
            controller: myApp.controllers.masterController,
            action: 'viewpost',
            post: record
        });
    },
});

当数据出来时，它看起来类似于：

（黑匣子是“编辑”的内容，没有错误代码）

最后，我认为控制器正在将数据“转储”到“MyApp.views.PostSingleView”中，而不是按照我在TPL中的请求对其进行格式化，尽管我不知道如何修复它。非常感谢所有帮助

更新：根据要求，以下是RegModel：

    Ext.regModel("CategoryModel", {
    fields: [
        {name: "id", type: "int"},
        {name: "title", type: "string"},
        {name: "body", type: "string"},
    ],
    hasMany: {
        model: 'Post',
        name: 'posts'
    }
});

下面是json的一个示例：

{
   "status":"ok",
   "post":{
      "id":1037,
      "type":"post",
      "slug":"post-title",
      "url":"http:\/\/localhost:8888\/jsontest\/PostTitle\/",
      "status":"publish",
      "title":"Post Title",
      "title_plain":"Post Title",
      "content":"<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<br \/>\nLorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<\/p>\n<!-- PHP 5.x -->",
      "excerpt":"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat [...]",
      "date":"2011-07-29 14:17:31",
      "modified":"2011-08-30 01:33:20",
      "categories":[
         {
            "id":87,
            "slug":"the-category",
            "title":"The Category",
            "description":"",
            "parent":17,
            "post_count":5
         }
      ],
      "tags":[

      ],
      "author":{
         "id":2,
         "slug":"tom",
         "name":"tom",
         "first_name":"tom",
         "last_name":"",
         "nickname":"",
         "url":"",
         "description":""
      },
      "comments":[

      ],
      "attachments":[

      ],
      "comment_count":0,
      "comment_status":"open"
   },
   "previous_url":"http:\/\/localhost:8888\/jsontest\/next-post\/",
   "next_url":"http:\/\/localhost:8888\/jsontest\/prev-post\/"
}

{
“状态”：“确定”，
“职务”：{
“id”：1037，
“类型”：“职位”，
“slug”：“post title”，
“url”：“http:\/\/localhost:8888\/jsontest\/PostTitle\/”，
“状态”：“发布”，
“标题”：“帖子标题”，
“标题”；“帖子标题”，
“内容”："知识本身是一种美德，是一种美德，是一种美德，是一种美德，是一种美德，是一种美德，是一种美德，是一种美德，是一种美德，是一种美德，是一种美德这是一种不平等的行为。除了偶尔因疏忽而死亡外，还必须为动物和动物的劳动负责。\n这是一种不平等的行为，是一种不平等的行为，是一种不平等的行为，是一种不平等的行为，是一种不平等的行为nostrud实习ullamco laboris nisi and aliquip ex ea commodo Consequeat.Duis aut irur door in reprehenderrit in voluptate velit esse cilum dolore eu fugia nullar paritatur.除了偶尔出于谨慎，还必须因疏忽而受到惩罚。\n“，
“摘录”：知识本身是一种美德，是一种美德，是一种美德，是一种美德，是一种美德，是一种美德，是一种美德，是一种美德，是一种美德，是一种美德，是一种美德“除非圣奥卡卡岛[……]”，
“日期”：“2011-07-29 14:17:31”，
“修改”：“2011-08-30 01:33:20”，
“类别”：[
         {
“id”：87，
“slug”：“类别”，
“标题”：“类别”，
“说明”：“，
“家长”：17岁，
“后计数”：5
         }
      ],
“标签”：[
      ],
“作者”：{
“id”：2，
“鼻涕虫”：“汤姆”，
“姓名”：“汤姆”，
“名字”：“汤姆”，
“姓氏”：“，
“昵称”：“，
“url”：“，
“说明”：”
      },
“评论”：[
      ],
“附件”：[
      ],
“注释计数”：0，
“评论状态”：“打开”
   },
“上一个url”：“http:\/\/localhost:8888\/jsontest\/next post\/”，
“下一个url”：“http:\/\/localhost:8888\/jsontest\/prev post\/”
}

尝试使用以下方法：

myApp.views.postSingleView.postSinglePanel.update(options.post.data);

原因是post实际上并不直接公开底层数据，因此需要使用属性数据

还有什么特别的原因让您停靠postSinglePanel？我会非常小心地使用过多的停靠项，因为它们是已知的bug和布局问题的来源。

尝试使用以下方法：

myApp.views.postSingleView.postSinglePanel.update(options.post.data);

原因是post实际上并不直接公开底层数据，因此需要使用属性数据

---

还有什么特别的原因让你停靠postSinglePanel？我会非常小心地使用太多停靠的项目，因为它们是bug和布局问题的已知来源。

一个简单的方法是编写你自己的方法来更新子面板（你也可以看到覆盖默认的更新方法）

从您的控制器：

Ext.regController('masterController', {
    // [...]
    'viewpost': function (options) {

        myApp.views.postSingleView.myUpdate(options.post.data); // note the .data
        // [...]
    },

});

---

一种简单的方法是编写您自己的方法来更新子面板（您还可以查看如何覆盖默认的更新方法）

从您的控制器：

Ext.regController('masterController', {
    // [...]
    'viewpost': function (options) {

        myApp.views.postSingleView.myUpdate(options.post.data); // note the .data
        // [...]
    },

});

---

使用Ext.面板的tpl配置选项，而不是不存在的itemTpl

---

正如前面有人提到的，使用模型实例和更新方法时要小心，您需要使用模型的数据属性。

使用Ext.Panel的tpl配置选项，而不是不存在的itemTpl

---

正如前面有人提到的，在使用模型实例和更新方法时要小心，你需要使用模型的数据属性。

很好的开始，但是现在它给了我“更少”的数据，但仍然是一个转储，而不是tpl调用的我注册的{body}。下面是它给我的：我博客文章中的一些内容……”=“2011-06-18 02:55:01”user=“”>很好的开始，但现在它给了我“更少”的数据，但仍然是一个转储，而不是tpl调用的我的注册{body}。这里是它给我的：我博客文章中的一些内容……”date=“2011-06-18 02:55:01”user=“”>您的解决方案给了我与上述答案相同的数据。数据较少，但看起来是这样的：我的博客文章中的一些内容……”date=“2011-06-18 02:55:01”user=“”>。另外，你会推荐什么来代替post单面板？我最终想在postSingleV中添加一个旋转木马和tabpanel

Ext.regController('masterController', {
    // [...]
    'viewpost': function (options) {

        myApp.views.postSingleView.myUpdate(options.post.data); // note the .data
        // [...]
    },

});