2015-09-07 2 views
1

У меня есть этот HTML:Список в ионического с условиями

<ion-content> 
<div class="bar bar-header bar-light"> 
    <h1 class="title">{{ 'SchoolHours' | translate}}</h1> 
</div> 
<ion-list> 
    <ion-item ng-repeat="day in days"> 
     {{day}} 
     <ion-list> 
      <ion-item ng-repeat="subject in list_subjects"> 
       <h2>{{subject.theme.name}}</h2> 
       <h3>{{subject.hour_ini}} - {{subject.hour_finish}}</h3> 
       <h3>{{ 'Teacher' | translate }} : {{subject.teacher.name}} - {{subject.teacher.mail}}</h3> 
      </ion-item> 
     </ion-list> 
    </ion-item> 
</ion-list> 

дни массива как это: [ "Понедельник", "Вторник", ..] list_subjects массива получили объекты. Эти объекты имеют атрибут, называемый будний день.

Я бы хотел, чтобы во втором списке HTML он перечислял только объекты, которые соответствуют текущему дню в днях массив.

Спасибо!

ответ

2

Решение # 1

Вы должны сделать свой собственный фильтр для этой цели, которая будет как этот

.filter("filterByDays", function(filterFilter){ 
    return function (subjects, day) { 
    return filterFilter(subjects,{weekday:day}) 
    }; 
}); 

и использовать его как этот

<ion-item ng-repeat="subject in subjects|filterByDays:day"> 

Demo с ваш код: http://play.ionic.io/app/a2238d1002a1
Documenation о том, как написать собственный фильтр: https://docs.angularjs.org/tutorial/step_09

Решение # 2

Ну это самый простой один, вы должны использовать GroupBy-фильтр, https://github.com/a8m/angular-filter, в этом случае вам не придется использовать days массив, чтобы сделать группу предметов по дням. Этот фильтр будет выполнять всю группировку с использованием свойства объекта weekday. См. Мой answer о том, как его использовать.
Demo с кодом: http://play.ionic.io/app/9f069e28c42a
ПРИМЕЧАНИЕ: Не используйте ng-if для Вашего случая, с помощью фильтров является лучшим и оптимальным решением для такого рода situdations.

Смежные вопросы