How to filter with ANGULAR JS not to repeat equal names?

Question

I have 2 related tables in the bank: The first table: it is called restaurant to another table : Cardapio . The Cardapio Table receives the primary key of the restaurant so it becomes foreign until then everything right, I take this information of the bank with a Php + Mysql Api I do the Join of the 2 tables and returns me a Json : Then I take this data with my Controller Angular Js and play for my view where I use Ng-repeat until everything right it lists the names of Restaurants only that unfortunately repeats the names. Example I have a Restaurant in the Bank named BABYS Gula if I go to the menu table and register 3 snacks for this restaurant the name of this Restaurant in my list repeats 3 times and repeats for those of more restaurants registered .

insert image description here

Answer 1

You can use the Angularui to solve this problem.

Example:

var myApp = angular.module('myApp', ['ui.filters']);

function MyCtrl($scope) {
$scope.names = [{
    id: 1,
    Name: 'Diego'
}, {
    id: 2,
    Name: 'Bruno'
}, {
    id: 3,
    Name: 'Diego'
}]
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui/0.4.0/angular-ui.js"></script>

<div ng-app="myApp" ng-controller="MyCtrl">
  <ul ng-repeat="item in names | unique: 'Name' ">
    <li>{{item.Name}}</li>
  </ul>
</div>

Note that after installing the lib just use the filter unique in his ng-repeat and choose which field should be unique:

ng-repeat="item in names | unique: 'Name'