Есть страничка, на котрой есть список объектов, каждый из которых (только один одновременно) можно разворачивать, то есть более-менее стандартный акордеон. Хочется, чтобы, развернутое состояние было выражено в виде отдельного sub-route /list/:itemId и над списком был выведен id развернутого элемента. Список может быть немаленьким и внутренние блоки тоже весьма большие, поэтому в идеале, лучше бы не рендерить неактивные внутренние блоки в принципе.
Есть примерно такая структура:
plunkr.
Сейчас оно работает неправильно, при выборе любого элемента рендерятся и разворачиваются все в списке. Не могу придумать, как и где дать условие на рендеринг внутреннего. Есть несколько версий, но развить их в рабочий прототип, увы, не удалось:
1. Передать iid из item.$scope наверх в list.$scope и в list.html сделать что-то типа:
<div ui-view ng-if="item === iid"></div>
Во-первых, не нашел, как это сделать, во-вторых есть подозрение, что это будет валить производительность.
1.1. Можно передавать не в list.$scope, а нагадить в $rootScope, но уж очень бы не хотелось.
2. Передать item в репитере из list.$scope в item.$scope, а в item.html обернуть всё в
<div ng-if="currentitem === iid"></div>
Предложите более правильный способ или пути завершения моих версий.
