How to display items of groups in AngularJS?

Question

I have items who are in groups.

WebAPI:

Add(new Name { group = "de", fname = "Hans" }); //germany
Add(new Name { group = "de", fname = "Peter" }); //germany
Add(new Name { group = "us", fname = "John" }); //usa
Add(new Name { group = "jpm", fname = "Chen" }); //japan

The service:

$scope.nameslist = personService.name.query();

The names are showing in a table:

<tr ng-repeat="item in filteredNames = (nameslist | filter:formGroup)">
   <td>{{ item.fname }}</td>
</tr>

The search form is in the same view of the table.

<div class="form-group form-group-sm">
  <label class="col-sm-2 control-label">DE</label>
  <div class="col-sm-1">
    <input type="radio" class="radio" name="checked" ng-click="chosenGroup()" ng-model="formGroup.checked" value="de" />
  </div>

  <label class="col-sm-2 control-label">US</label>
  <div class="col-sm-1">
    <input type="radio" class="radio" name="checked" ng-click="chosenGroup()" ng-model="formGroup.checked" value="us" />
  </div>

  <label class="col-sm-2 control-label">JPN</label>
  <div class="col-sm-1">
    <input type="radio" class="radio" name="checked" ng-click="chosenGroup()" ng-model="formGroup.checked" value="jpn" />
      </div>
</div>

How can I define the filter for the corresponding group?