javascript - 如何为按钮着色并保持状态？

Question

我有 3 个按钮和一个呈现不同列表的每个按钮。一次只能显示一个列表，我希望按钮在显示列表时显示颜色....

目前我已经设法使用 css 突出显示按钮:

button:active {
  border: 2px solid green;
}

在我的 css 文件中，但是当我点击页面中的其他地方时，突出显示消失了，我想要一些东西来为按钮着色，只要它的列表出现。

这是我的按钮:

  <button md-button (click)="setListToDisplay(0)" class="md-primary">List1</button>

  <button md-button (click)="setListToDisplay(1)" class="md-primary">List2</button>
</div>

<md-content>

      <div class="list-bg" *ngFor="#item of items>
        <div>id: {hetId(item)}}</div>
        <br>
        <div>name: {{getName(item)}}</div>
      </div>
    </div>

</md-content>

谢谢!

Answer 1

将类绑定(bind)添加到您的按钮。

例如: [class.yourClass]="selectedGroupNumber == 0"将添加类 yourClass每当selectedGroupNumber 到按钮元素等于 0 .