Question

I am using angularjs for my page. I want to filter the values from the JSON object, So that no redundancy exists. But I didn't find any way to get the unique values from angular ng-repeat. Is there anyway to do that?

Ok, Here is some description about the question. I have a JSON in this format. This JSON I am getting from a service. So we cant expect how the repeated data occure.

result = [
        {
            _id: "500004",
            subject: "Complete the task",
            date: "25 Aug, 2013"
        },      
        {
            _id: "500004",
            subject: "Complete the task",
            date: "25 Aug, 2013"
        },      
        {
            _id: "500005",
            subject: "Attend to the event",
            date: "2 Jan, 2013"
        },      
        {
            _id: "500065",
            subject: "Some task deadline",
            date: "20 Sep, 2013"
        },      
        {
            _id: "500004",
            subject: "Complete the task",
            date: "25 Aug, 2013"
        }
]

I want the output JSON to be with no repeated elements, So that my output will be something like this

result = [
        {
            _id: "500004",
            subject: "Complete the task",
            date: "25 Aug, 2013"
        },      
        {
            _id: "500005",
            subject: "Attend to the event",
            date: "2 Jan, 2013"
        },      
        {
            _id: "500065",
            subject: "Some task deadline",
            date: "20 Sep, 2013"
        }
]
Était-ce utile?

La solution

You can make use of Angular UI which has the unique filter defined.

The source can be found here.

Basically, you can then make use of the filter as follows:

<div ng-repeat="item in result | unique:'_id'">
    //Body here
</div>

Autres conseils

You can use 'unique'(aliases: uniq) filter in angular.filter module (https://github.com/a8m/angular-filter)

usage: colection | uniq: 'property'
you can filter by nested properties to : colection | uniq: 'property.nested_property'

So you can do something like that..

function MainController ($scope) {
 $scope.orders = [
  { id:1, customer: { name: 'foo', id: 10 } },
  { id:2, customer: { name: 'bar', id: 20 } },
  { id:3, customer: { name: 'foo', id: 10 } },
  { id:4, customer: { name: 'bar', id: 20 } },
  { id:5, customer: { name: 'baz', id: 30 } },
 ];
}

HTML: We filters by customer id, i.e remove duplicate customers

<th>All customers list: </th>
<tr ng-repeat="order in orders | unique: 'customer.id'" >
   <td> {{ order.customer.name }} , {{ order.customer.id }} </td>
</tr>

result: All customers list:
foo 10
bar 20
baz 30

var data = [
    {
        _id: "500004",
        subject: "Complete the task",
        date: "25 Aug, 2013"
    },      
    {
        _id: "500004",
        subject: "Complete the task",
        date: "25 Aug, 2013"
    },      
    {
        _id: "500005",
        subject: "Attend to the event",
        date: "2 Jan, 2013"
    },      
    {
        _id: "500065",
        subject: "Some task deadline",
        date: "20 Sep, 2013"
    },      
    {
        _id: "500004",
        subject: "Complete the task",
        date: "25 Aug, 2013"
    }
]

var uniqueNames = [];
var uniqueObj = [];

for(i = 0; i< data.length; i++){    

    if(uniqueNames.indexOf(data[i]._id) === -1){
        uniqueObj.push(data[i])
        uniqueNames.push(data[i]._id);        
    }       

}

console.log('uniqueObj',uniqueObj)

http://jsfiddle.net/C97DJ/165/

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top