如何仅使用Angular6在单击的按钮上设置活动类？答案

【问题标题】：How to set active class on clicked button only using Angular6?如何仅使用Angular6在单击的按钮上设置活动类？
【发布时间】：2019-02-15 11:12:26
【问题描述】：

我连续有 3 个按钮。我只想在单击的按钮上设置活动类，但问题是当我在一个按钮之后单击另一个按钮时，它会在所有按钮上设置活动类。

设置活动类无法正常工作。单击时，所有按钮都会获得活动类。如果我单击 2 个按钮，则单击时会在两个按钮上设置活动类。

这是我在 stackblitz 的代码

我想一次只在单击的按钮上设置活动类，而不是在所有按钮上。

【问题讨论】：

【解决方案1】：

我认为你可以通过 angular dom 功能更轻松地做到这一点。

你可以在这里显示：

这是我认为你想要的样本，但我认为你可以做得更好：

【讨论】：

【解决方案2】：

据我所知，您需要切换活动和非活动状态：

这是新的plunker，看看它是否解决了问题：

我删除了负责在每个按钮上应用phase-active 的event.srcElement.classList.add('phase-active')

【讨论】：