Изменение цвета фона в элементе списка при нажатии до тех пор, пока он не будет нажат снова

У меня есть приложение angular, в котором есть список, который похож на HTML:

<a *ngFor="let satz of selSaetze" (click)=selSatzDetail(satz.timestamp) class="list-group-item" tabindex="0" role="row">
    <div class="row">
        <div class="col-xs-4 col-sm-2">{{satz.id}}</div>
        <div class="col-xs-8 col-sm-12">
            <h4>{{satz.timestamp}}</h4>
            <p>{{satz.dsn}}</p>
        </div>
    </div>
</a>

Моя цель состоит в том, чтобы каждый раз, когда пользователь нажимает на элемент, цвет фона меняется, и он должен оставаться таким, пока пользователь снова не нажмет на тот же элемент!

Как я могу сделать это с машинописным текстом?

При чем тут машинопись? Вероятно, вы захотите использовать :focus в своем .css

FortyTwo 31.10.2018 12:54

Хм .. У меня есть список - пользователь нажимает на несколько пунктов списка. Цвет фона изменится. Пользователь снова нажимает на один или два элемента, цвет снова меняется. это больше похоже на «отбор». Думаю нужен машинописный текст.

JoJo123 31.10.2018 13:24

Как у вас этот список? Это из бутстрапа? Или вы его создаете?

FortyTwo 31.10.2018 13:47
0
3
254
1

Ответы 1

Я построил это решение

 <a class="list-group-item" tabindex="0" role="row" (click)="selSatzDetail(satz.timestamp);whenClicked[i]=!whenClicked[i]"
                [style.background-color] = "whenClicked[i]  ? '#ddf1c1' : 'white'"
                *ngFor="let satz of selSaetze; let i = index">

whenClicked = [ложь, ложь]; в машинописном тексте не требуется.

Другие вопросы по теме