Блог

У меня есть следующий код:

 <tr *ngFor="let user of users">
    <td>{{user.name}}</td>
    <td>{{user.surname}}</td>
    <td>{{user.age}}</td>
    <td>{{user.email}}</td>
    <td>{{user.username}}</td>
    <td>{{user.registrationDate}}</td>
</tr>
 

Мне нужно применить пользовательский канал для фильтрации пользователей, которые не активны.

 <tr *ngFor="let user of users | filterBy: 'active'">
 

Это работает.

Но я хочу, чтобы канал применялся условно, только если пользователи нажимают на заданную кнопку. Я имею в виду, что пользователи нажимают на «Показать только активных» и получают список, отфильтрованный только активными пользователями.

Возможно, я не могу сделать это, используя канал в HTML-коде, но я должен использовать его в компоненте, используя канал следующим образом:

 this.users = new FilterByPipe().transform(this.users, 'active');
 

Разве это не грязный способ, так как у меня должен быть резервный массив для восстановления предыдущих значений?

Есть какой-нибудь лучший способ?