Маршрут, который наблюдает свойство на компоненте, который связывается с ним

Question

У меня есть список, если предметы в items маршрут, который использует компонент event-item отображать каждый из них. Этот компонент имеет два вычисленных элемента, которые устанавливают некоторые классы прямо сейчас, чтобы показать пользователю некоторую информацию о каждом элементе...

classNameBindings: ['winning','closed'],
item: null,
winning: Ember.computed('item.item_high_bid_user_id','userService.user_id',function(){
    return this.get('item.item_high_bid_user_id') == this.get('userService.user_id');
}),
closed: Ember.computed('item.item_status',function(){
    return this.get('item.item_status') === 2;
})

В шаблоне компонента каждый элемент в списке обернут в link-to что ссылки на item маршрут, который отображает один элемент.

в item шаблон и даже маршрут я хотел бы наблюдать winning а также closed вычисленные, которые находятся на соответствующем компоненте, чтобы показать или скрыть некоторые вещи в item шаблон (т. е. скрыл раздел торгов, если элемент закрыт и т. д.)

Каков был бы правильный способ сделать это?

Кстати, я на Эмбер 2.2.0 Ember Data 2.2.0 и Эмбер-кли 1.13.13

Answer 1

Если твой event-item Компонент связан с item маршрут, я полагаю, вы передаете модель элемента в link-to вспомогательный, что означает, что все атрибуты, необходимые для вычисления этих свойств, все еще будут доступны в item контроллер.

// templates/whichever-template-holds-items.hbs
{{#each items as |item|}}
  {{event-item model=item}}
{{/each}}


// templates/components/event-item.hbs
<div>
  {{link-to 'item' model}} // pass model to item route
</div>


// controllers/item.js
import Ember from 'ember';

export default Ember.Controller.extend({
  // include userService

  winning: Ember.computed.equal('model.item_high_bid_user_id','userService.user_id'),
  closed: Ember.computed.equal('model.item_status', 2)
});


// templates/item.hbs
{{#if winning}}
  // show winning stuff
{{/if}}

{{#if closed}}
  // show closed stuff
{{/if}}

Кроме того, я заметил, что у вас было сочетание обоих == а также === для ваших условий в коде вы разместили. Большую часть времени вы захотите использовать ===, см. Этот пост.

Почти забыл - Ember.computed.equal

---

ОБНОВЛЕНИЕ (в ответ на ваш комментарий ниже)

Есть несколько способов предупредить контроллер о том, что значение в компоненте изменилось, но ни один из них на самом деле не способствует вашей текущей ситуации.

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

Второй способ (который на самом деле не идеален для IMO) - использовать службу в виде паба / субмашины, которая позволит удаленным компонентам / контроллерам общаться друг с другом ( подробнее об этом методе можно прочитать здесь). Вы, вероятно, получите смешанные ответы, если поступите так, потому что это может отразиться на потоке данных вашего приложения. Но иногда ваш выбор ограничен.

Учитывая все вышесказанное, я бы, вероятно, придерживался перерасчета в контроллере, а не пытался пересылать данные через ваше приложение с одного контроллера на другой. В конце все равно будет меньше кода и меньше работы для фреймворка. Надеюсь, это было полезно.