Emberjs: Прототип функций в хэш

Question

У меня есть четыре вертикальные панели:

• Первая панель показывает меню и позволяет выбрать данные, которые вы хотите отобразить
• Вторая панель позволяет выбрать фильтр из списка заранее определенных фильтров
• Третья панель позволяет увидеть список результатов фильтра
• Панель Forth позволяет отобразить детали конкретного элемента

Для этого пользовательского интерфейса я использую вложенные маршруты и розетки:

App.Router.map(function() {
    this.resource('customers', { 'path' : '/customers' }, function() {
        this.resource('customers_filters', { 'path' : '/:filter' }, function() {
            this.resource('customer', { 'path' : '/show/:customer_id' });
        });
    });
});

Все работает нормально, но когда я показываю детали конкретного предмета (последний маршрут на моих вложенных маршрутах), хэш в URL не является правильным.

• Первый маршрут ОК: #/Клиенты
• Второй маршрут ОК: #/клиенты/все
• Третий маршрут KO: #/customs/function filter () {[Native Code]}/show/2

Я поставил пример на JSBIN: http://jsbin.com/inagavo/1

Что я делаю не так ? Спасибо

Answer 1

Проблема в том, что Ember создает URL на основе моделей для каждого маршрута. Когда он пытается построить маршрут ниже активного/всего маршрута, он использует ваш массив элементов (у которого нет поле, называемого фильтром), поэтому он не знает, как определить, есть ли в настоящее время все/фильтр модель. Хорошей практикой является то, чтобы ваш слизняк (значение в пути) соответствовала свойству на модели.

Если он не соответствует, вы можете переопределить метод Serialize в маршруте, поэтому Ember знает, как сериализовать вашу модель для URL.

App.CustomersFiltersRoute = Ember.Route.extend({
  model: function(params) {

    if(params.filter == "active") {
      return _.where(App.Customers, {isActive: true});
    }

    return App.Customers;
  },

  serialize: function(model){
    if(model === App.Customers){
      return {filter:'all'}; 
    }
    return {filter:'active'};
  }
});

http://jsbin.com/inagavo/6/edit