4

私は Ember を学んでおり、RESTful サービスからデータを取得するページ分割されたリストを作成しようとしています。

サービスは次のようにデータを返します。

{
    result: [
        {
            id: " ALFKI "
            companyName : " Alfreds Futterkiste "
            contactName : " Maria Anders " ,
            ContactTitle : " Sales Representative "
            address : " Obere Str 57" ,
            city: "Berlin " ,
            postalCode : " 12209 " ,
            country: " Germany" ,
            phone: " 030-0074321 "
            fax: " 030-0076545 "
            link: " http://localhost:2828/customers/ALFKI "
        }
        {
            id: " ANATR "
            companyName : " Ana Trujillo sandwiches and ice cream "
            contactName : " Ana Trujillo " ,
            ContactTitle : "Owner " ,
            address : " 2222 Avenue of the Constitution " ,
            city: " Mexico DF "
            postalCode : " 05021 " ,
            country: " Mexico " ,
            phone: " (5) 555-4729 "
            fax: " (5) 555-3745 "
            link: " http://localhost:2828/customers/ANATR "
        }

        ]
        metadata : {
            offset : 1,
            limit : 10,
            totalCount : 92,
            links: {
                self " http://localhost:2828/customers?format=json&offset=1&limit=10 "
                last: " http://localhost:2828/customers?format=json&offset=82&limit=10 "
                next : " http://localhost:2828/customers?format=json&offset=11&limit=10 "
            }
    }
}

サーバーは常に、ページネーション データをリンクとして含むコレクションを返します。新しいページをリクエストする場合、URL は次の形式になります。

http://api.server/customers?offset=1&limit=10

私のルート構成は次のとおりです。

Northwind.CustomersRoute = Ember.Route.extend({    

    model: function () {

        var controller = this.controllerFor('customer');

        return this.get('store').findQuery('customer', {offset: controller.offset, limit:controller.limit});

    }

});

このシナリオにコントローラーを実装するにはどうすればよいですか?

前もって感謝します。

4

1 に答える 1

0

解決しました。

新しいルーター

Northwind.CustomersRoute = Ember.Route.extend({        
    model: function () {    
        var controller = this.controllerFor('customer');        

        return this.get('store').findQuery('customer', { offset: controller.offset, limit: controller.limit });    
    },   

    setupController: function (controller, model) {
        controller.set('model', model);
        controller.set('contentLoaded', true);
    }    
});

これに似たページネーション mixin を使用しています。

コントローラ

Northwind.ArrayController = Ember.ArrayController.extend(Northwind.PaginationMixin, {        
    contentLoaded: false,           
    loadMetadata: function () {     
        if (!this.get('contentLoaded')) return;

        var model = this.get('model');
        var meta = this.get('store').metadataFor(model.type);

        if (meta) {
            // Metadata object
            var metadata = Ember.Object.create({
                offset: meta.offset,
                limit: meta.limit,
                totalCount: meta.totalCount,
                links: Ember.makeArray()
            });

            // Pagination links
            if (meta.links) {
                for (var link in meta.links) {
                    var lnkObj = Ember.Object.create(Northwind.Common.Uri.queryParams(meta.links[link]));
                    lnkObj.set('rel', link);
                    metadata.links.pushObject(lnkObj);
                }
            }

            this.set('metadata', metadata);
            this.set('limit', metadata.limit);
            this.set('totalCount', metadata.totalCount);
            // offset is automatically calculated based on page property
        }

    }.observes('contentLoaded'),

    refresh: function () {    
        var offset = this.get('offset');
        var limit = this.get('limit');
        var self = this;

        self.set('contentLoaded', false);

        this.get('store').findQuery('customers', { offset: offset, limit: limit }).then(function (result) {          
            self.set('model', result);
            self.set('contentLoaded', true);
        });    
    }.observes('page')    
});

https://github.com/jdmartinez/Northwind/tree/pre-0.1

于 2014-04-21T16:18:54.467 に答える