Css 如何使用ng click在连续单击时执行两个不同的操作？

在我的angular应用程序中，我得到了一个带有下拉列表的popover，列表中每个元素有3个按钮（第三个按钮未显示在图片中）。
我已经实现了当你点击一个按钮时，它会改变背景，你可以在这里看到：

它的代码非常简单：

控制器：

this.selectedButtons = 'unconfirmed';


setButton(buttonState: string) {
        this.selectedButtons = buttonState;
    }

isButton(buttonState: string) {
        return buttonState === this.selectedButtons;
    }

视图：

ng-click="vm.setButton('declined')"

ng-class="{'Default' : vm.isButton('unconfirmed'), 'Confirmed' : vm.isButton('confirmed'), 'Declined' : vm.isButton('declined'), 'Deleted' : vm.isButton('deleted')}"

非常简单，当我单击其中一个按钮时，它会将var设置为一个字符串，然后使用ng类调用与该字符串相等的类

按预期工作，但我有一个问题，我还想当你再次点击相同的按钮，它“撤消”你的选择，所以返回到“默认”类

我知道如何使用这样的东西来实现这一点：

ng click=test=！测试

---

因此，当您再次单击它时，它会返回到初始状态，但我不知道如何实现这一点。

根据提供的代码，如果要“撤消”，则应检查按钮是否处于已更改状态，如果是，则应将其更改回：

this.selectedButtons = 'unconfirmed';


setButton(buttonState: string) {
        if (this.selectedButtons == buttonState) {
            this.selectedButtons = 'unconfirmed';
        }
        else {
            this.selectedButtons = buttonState;
        }
    }

isButton(buttonState: string) {
        return buttonState === this.selectedButtons;
    }

---

如果（this.selectedButtons==buttonState）{this.selectedButtons=null；}

工作得很好，不知道为什么我没有想到它，看起来很有逻辑！非常感谢。