각도 4로 변경 id에 의한 CSS

Question

바닐라 JS를 사용하여 요소 ID별로 CSS 속성을 변경하려고합니까?

나는 다음과 같은 효과를 달성하기 위해 노력하고 있습니다 : 첫 번째 단추가 바닥 아래를 클릭 한 후

1. 을, 상단의 첫 번째 단추는 btn-dark에서 btn-warning에이 클래스의 변경해야합니다.
2. 나머지 버튼은 다음과 같은 패턴을 따라야합니다. # b2를 클릭하면 # d2가 btn-dark에서 btn-warning으로 변경됩니다.

나의 현재 시도 :

<div class="row"> 
    <button *ngFor="let number of [1,2,3,4,5,6,7,8,9,10]" 
    type="button" 
    class="btn btn-dark" 
    id="d{{number}}" 
    > 
    </button> 
</div> 

<div class="row"> 
    <button (click)="onClick($event)" 
    *ngFor="let number of [1,2,3,4,5,6,7,8,9,10]" 
    type="button" 
    class="btn btn-secondary" 
    id="b{{number}}">{{number}} 
    </button> 
</div> 

Screenshot displaying the template

Answer 1

는 시간

stackblitz demo link

Answer 2

사용 ngClass, 예컨대 :

<button [ngClass]="{'btn-dark': true}">...</button>