javascript - 在 Angular 中的两个按钮之间切换类，但限制以防止同一个按钮更改类

Question

尝试创建一些非常基本的功能，基本上使两个按钮的行为类似于单选按钮。有两个按钮，用于根据显示的内容显示/隐藏不同的内容。所以它按预期工作，除了它在任何点击时都会发生变化。因此，如果我两次单击同一个按钮，它就会更改类。如果单击另一个按钮，我只需要更改它:

<button class="someClass" ng-class="{true: 'green', false: 'blue'}        [!yupNope.isSelected]" ng-click="yupNope.isSelected = !yupNope.isSelected">YES</button>
   <button class="someClass" ng-class="{false: 'green', true: 'yupNope'}[!yupNope.isSelected]" ng-click="yupNope.isSelected = !yupNope.isSelected">NO</button>

因此，如果单击"is"，则它应该更新，“否”也应该更新。但是，如果在单击“否”之前再次单击"is"，则应该没有任何变化。

这是一个可以玩的 Plunkr:

Plunkr Demo

Answer 1

将 yupNope.isSelected = !yupNope.isSelected 替换为 ngClick 表达式，分别将 yupNope.isSelected 设置为 true/false:

<button ng-click="yupNope.isSelected = false" class="someClass" ng-class="{true: 'green', false: 'blue'}[!yupNope.isSelected]">YES</button>
<button ng-click="yupNope.isSelected = true" class="someClass" ng-class="{false: 'green', true: 'yupNope'}[!yupNope.isSelected]">NO</button>

演示:http://plnkr.co/edit/HJfmYf6d9dnNqZLwYLFF?p=preview