Ember HTMLBars встроенные комбинированные условия

Question

При попытке иметь простое условное присвоение класса стилей в HTMLBars с Ember 1.13, следующий код делает большую работу:

{{#each items as |item|}}
  <li class="tag {{if item.selected 'active' 'inactive'}}">{{item.key}}</li>
{{/each}}

Тем не менее, есть ли способ объединить условия в верхнем регистре, например, проверить другое условие? Что-то вроде следующего кода...

{{#each items as |item|}}
  <li class="tag {{if (item.selected or noneSelected) 'active' 'inactive'}}">{{item.key}}</li>
{{/each}}

... или это единственный способ выполнить проверку нескольких условий с помощью помощника Ember?

Спасибо за вашу поддержку!

Answer 1

Вы хотите сделать свой собственный помощник, давайте назовем это conditional-or:

import Ember from 'ember';

const { Helper: { helper } } = Ember;

export function conditionalOr(conditions, {valid, invalid}) {
  invalid = invalid || '';
  return conditions.some(elem => elem) ? valid : invalid;
}

export default helper(conditionalOr);

Функция some() выполняет итерацию по элементам массива и возвращает значение true, если выполняется один из критериев.

И вы сможете использовать его в своем шаблоне так:

<li class="tag {{conditional-or item.selected noneSelected valid='active' invalid='inactive'}}">{{item.key}}</li>