一个项目选择不在AngularJS中的单选按钮上工作

Question

我正在使用AngularJS和过滤器选项。当我在单选按钮中选择一个项目时，它会获得正确的数据。

<input ng-click="filter = !filter" ng-value="!filter" ng-checked="filter" type="radio" ng-model="ctrl.filter[category]" />

但是我需要在单选按钮中选择一个并且它不起作用。问题是什么？感谢。

DEMO

Answer 1

要正常工作，无线电输入需要name属性。对于所有无线电广播应该是相同的。

您还需要更改广播的ng-model以将其value存储在单个媒体资源中。

<input ng-click="filter = !filter" ng-value="category" name="wineCategory" ng-checked="filter" type="radio" ng-model="ctrl.filter" />

最后，您需要调整过滤方法。

Answer 2

“收音机”框组中的所有输入必须只有一个对ng模型的引用，这通常是输入的值。

因此，您的输入标记将是

      <input value="{{category}}" type="radio" ng-model="ctrl.filterCategory" />

值=类别为红色，或者香槟。

现在你的过滤器功能也会改为使用像这样的ng-model

  function filterByCategory(wine) {
    return (self.filterCategory === wine.category || self.filterCategory === "") ? 'show':'hide';
  }

在这里工作演示。

http://jsfiddle.net/nah42h1c/2/