How to show a JSON list without repeat Angular JS

Question

I'm using Angular JS to show a list of items from a JSON get request.

I'm able to retreive the items, but i'm not able to show them in the right order without repeating.

My JSON file looks like :

[
{
"id":"32",
"competiton":"série1",
"game":"A- B"
},
{
"id":"33",
"competiton":"série1",
"game":"C - D"
}
]

here is my code to retrieve the items :

app.controller('customersCtrl', function($scope, $http) {
$http.get("http://myserver.com/matches?date=2015-05-18")
    .success(function (response) {
        $scope.matches = response;
        for (var i = 0; i < response.length; i++) {
            setName($scope.matches, i);
        }
    });

var setName = function (matches, index) {
    $http.get("http://myserver.com/ofc/competitions/" + matches[index].idCompetition)
        .success(function (response) {
            matches[index].competition = response.name;
             $scope.competitions[index] = response.name;
        });
}
});

and here is how i'm showing them :

<div ng-controller="customersCtrl"> 
<div class="list">


   <div class="item item-divider" ng-repeat="m in matches">
    {{ m.competition}}
  </div>
  <a class="item" href="#" ng-repeat="m in matches">
    {{ m.game }}
  </a>
</div>
</div>

Items are showig like :

Série A

A - B

C - D

I want to show them like :

Série A

A - B

C - D .... etc

I feel like your json isn't good for your use case. You should maybe gather your data by competitions. — Okazari
– Okazari, Commented May 19, 2015 at 14:49

freethinker · Accepted Answer · 2015-05-19 14:49:39Z

1

Use "unique":

<div class="item item-divider" ng-repeat="m in matches | unique:'competition'">
    {{ m.competition}}
  </div>

answered May 19, 2015 at 14:49

freethinker

2,4454 gold badges28 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Okazari Over a year ago

Nice spot but i feel that there is a more deep miss-use behind this behaviour. Anyway this will do the work ;)

Yasser B. Over a year ago

Thanks for your response, but this is giving an error Error: [$injector:unpr] Unknown provider: uniqueFilterProvider <- uniqueFilter

carton Over a year ago

AngularJS does not have a built-in unique filter. You may be look at this : angular-ui.github.io "Angular UI" so you can use unique filter :) .

Collectives™ on Stack Overflow

How to show a JSON list without repeat Angular JS

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related