angular2 простой addClass (стиль jquery)?

Question

Я боролся с самой простой вещью ... мне нужно добавить класс к <div>, когда я нажимаю, скажем, на button. Я искал онлайн и здесь на stackoverflow в течение нескольких часов, и все, что я могу найти, это несколько слишком сложные примеры с ngFor s, которые я не могу (и не могу) деконструировать, чтобы приспособить его к тому, что мне нужно.

Я хочу добиться чего-то такого же простого (jquery) в angular2 / typescript:

 $(".button").click(function() {  
    $(".element").addClass("active");      
  });

У меня есть папка с компонентами с обычными файлами html, scss и ts. эта функция не должна быть глобальной или что-то странное.

Я не могу поверить, что такое простое решение стало настолько сложно достичь с помощью современных сред.

любая помощь очень ценится!

Answer 1

Все просто. вам нужно использовать ngClass вот так:

<button (click)="isActive = true">Your button</button>
<div class="element" [ngClass]="{'active': isActive}"

https://angular.io/api/common/NgClass

Answer 2

Это совсем не сложно: вы просто не знаете, где / что искать.

Первое решение:

<div [class.myClass]="isClicked"></div>
<button (click)="isClicked = true">Click me</button>

Второе решение

<div #myDiv></div>
<button (click)="myDiv.className='myClass'">Click me</button>