moon.DataList in a moon.Accordion in enyojs

时间:2014-12-12 18:42:04

标签: javascript webos enyo

我有这些数据:

....
    [
        {"id_category": 1, 
        "name": "Category 01",
        subcategories:[
            {"id_sub":1, "name":"suba 1"},
                {"id_sub":2, "name":"subaa 2"}
            ]},
        {"id_category": 2
        ,"name": "Category 02"
        ,subcategories:[
            {"id_sub":1, "name":"sub 1"},
            {"id_sub":2, "name":"sub 2"}
        ]}
    ]
....

我想将它设置为月亮。手风琴 我有这个代码: 首先我的组件:

....
    enyo.kind({
        name: "myapp.ResultList",
        kind: "moon.DataList",
        selectionProperty: "selected",
        mixins: ["Group"],
        create: function() {
            this.inherited(arguments);
            this.addClass(this.orientation);
        }
    });
    enyo.kind({
        kind: "moon.Accordion",
        name: "myapp.ResultAccordion",
        content: "",
        mixins : ["moon.DataList"],
        bindings: [
            {from: ".model.name", to:".content"}
        ],
        subcategories:[],
        create: function() {
            this.inherited(arguments);
        },
        modelChanged: function() {
            this.inherited(arguments);
            if (!this.model) {
                return;
            }
            this.model.set("item", this);
            this.subcategories = this.model.attributes.subcategories;
            this.controller = new enyo.Collection([]);
            var objects=[];
            for( var sc in this.subcategories){
                var m = new myapp.SubCategoryModel(this.subcategories[sc]);
                objects.push(m);
            }
            this.controller.add(objects);
            this.resized();
        }
    });
    enyo.kind({
        name: "myapp.ResultAccordionItem",
        bindings: [
            {from: ".model.name", to:".content"}
        ]
    });
....

然后在小组中:

....
    enyo.kind({
    name: "myapp.PartialPanel",
    classes: "moon enyo-unselectable main-view enyo-fit",
    kind: "moon.Panels",
    ....
    components:[{
        kind: "myapp.ResultList",
        style: "position: inherit !important;",
        fit: true,
        controller: ".app.$.categoryCollection",
        components: [{
            kind: "myapp.ResultAccordion",
            onSpotlightRight:"onFocusCategoryRight",
            components:[{
                kind: "myapp.ResultAccordionItem"
            }]
        }] 
    ....
....

在我的控制器中,设置我的数据:

....
    setdata: function(){
        var test= {
            "count": 1,
            "next": null,
            "previous": null,
            "results": [
                {"id_category": 1, "name": "Category 01",
                    subcategories:[
                        {"id_sub":1, "name":"suba 1"},
                        {"id_sub":2, "name":"subaa 2"}
                    ]
                },
                {"id_category": 2,"name": "Category 02",
                    subcategories:[
                        {"id_sub":1, "name":"sub 1"},
                        {"id_sub":2, "name":"sub 2"}
                    ]
                }
            ]};
            var models = test.results;
            this.next = test.next;
            this.previous = test.previous;
            this.count = test.count;
            var objects = [];
            for(var p in models){
                console.log(models[p]);
                var m = new myapp.CategoryModel(models[p]);
                objects.push(m);
            }
            this.app.controllers.categoryCollection.add(objects);
            return objects;
        ....
    ...
....

但只有渲染类别,而不是我的子类别,请帮助我。

1 个答案:

答案 0 :(得分:0)

问题在于,您无法使用mixins将组件类型混合在一起。您可以使用一些非常具体的mixin来为现有类型添加功能。查看此mixins列表:http://enyojs.com/docs/latest/#/namespaces:enyo-mixins

此外,您可以替换所有这些代码:

        this.subcategories = this.model.attributes.subcategories;
        this.controller = new enyo.Collection([]);
        var objects=[];
        for( var sc in this.subcategories){
            var m = new myapp.SubCategoryModel(this.subcategories[sc]);
            objects.push(m);
        }
        this.controller.add(objects);

使用:

        this.controller = new enyo.Collection({model: "myapp.SubCategoryModel"});
        this.controller.add(this.subcategories);

(这假设您在2.5.1。如果是这样,您也可以删除绑定上的前导点。)