Ember организира маршрути и ресурси?

Здравейте момчета, имам куп изображения, които искам да сортирам по „Скорошни“, „Популярни“ или „Горещи“.
Засега имам маршрут, който е дефиниран така:

App.Router.map(function () {
    this.route("browse");
});

Исках да направя нещо като разглеждане/скорошни, за да покажа изображенията по скорошни и разглеждане/популярно за популярните, но не мога да вложа маршрути.

Да променя ли кода си, така че вместо маршрута за преглед да имам ресурс за изображения?
И да вложа в него моите филтри? така че ще имам нещо като изображения/последни изображения/популярни...
Изглежда твърде много маршрути, може би ще имам в бъдеще 10 филтъра означава ли това, че ще трябва да създам 10 различни маршрута и контролери? не мога ли да използвам само 1 контролер и да задам логика за филтриране (с ember-data)?


person kfir124    schedule 08.06.2014    source източник


Отговори (2)


Вероятно трябва да използвате съществително (images) като име на ресурс. След това можете да създадете множество маршрути, като всеки прилага различен филтър върху вашите данни (различен модел кука), но всеки използва същия контролер/шаблон. Опростен пример:

Първо създайте ресурс за изображения с индивидуални маршрути за вашите филтри:

App.Router.map(function() {
  this.resource('images', function () {
    this.route('hot');
    this.route('new');
  });
});

След това създайте споделен маршрут, който ще използва твърдо кодиран шаблон и контролер. Частта с setupController е необходима, защото контролерът по подразбиране ще бъде (вероятно автоматично генериран) контролер за ImagesNew или ImagesHot. Трябва да вземете дадения модел и да го използвате, за да настроите споделен ImagesController.

App.ImagesRoute = Ember.Route.extend({
    renderTemplate: function() {
      this.render('images', {
        controller: 'images'
      });
    },
    setupController: function (_, model) {
      this.controllerFor('images').set('content', model);
    }
});

App.ImagesController = Ember.Controller.extend({
  // your shared logic here
});

И накрая, можете да създадете филтриращи маршрути. Всеки трябва да наследи базовия ImagesRoute и да предостави свои собствени филтрирани данни в куката на модела.

App.ImagesHotRoute = App.ImagesRoute.extend({
    model: function () {
      return this.store.getHotImages();
    }
});

App.ImagesNewRoute = App.ImagesRoute.extend({
    model: function () {
      return this.store.getNewImages();
    }
});

Пример за работещ jsbin тук.

person panta82    schedule 08.06.2014
comment
благодаря, лошо прочетох за setupController и renderTemplate, между другото, защо се нуждаехме от персонализирания renderTemplate? - person kfir124; 08.06.2014
comment
Така че и ImagesHotRoute, и ImagesNewRoute ще използват един и същ контролер и шаблон. В противен случай те биха използвали шаблон images.new / images.hot и ImagesNewController / ImagesHotController. - person panta82; 08.06.2014

Най-добрата практика е да започнете с ресурс и след това да вложите маршрути в него.

App.Router.map(function() {
  this.resource('images', { path: '/' }, function() {
    this.route('browse');
    this.route('hottest');
    this.route('popular');
  });
});

Що се отнася до създаването на десет различни контролера, това не е необходимо. Предполагам, че логиката на маршрута ще бъде различна (HottestRoute ще зареди най-горещите снимки, PopularRoute ще зареди най-популярните), но логиката на контролера трябва да е същата. Вероятно е най-добре да имате именувани контролери, но те могат просто да разширят вече дефиниран контролер.

App.ImagesPopularController = ImagesController.extend();
person Ryan    schedule 08.06.2014