AngularJS : check if key/value exist in object and construct an array of objects

Question

Here's a method of a service I'm using. It finds all incomes from projects (related to this question : Angular service calling another service) and make a new array of objects.

I want that array of objects to sort incomes by year and trimester, so I could loop into it easily in the view (with ng-repeat).

My current data (returned by Incomes.buildAndGetIncomes(), you can see below) :

[  


 {  
      "projectName":"Deuxième test",
      "clientName":"Deuxième client",
      "typeIncome":"Accompte",
      "amount":1000,
      "date":"2014-09-10",
      "notes":"Chèque / LDD",
      "trim":"third",
      "year":"2014"
   },
   {  
      "projectName":"efzefze",
      "clientName":"zfezefzef",
      "typeIncome":"Accompte",
      "amount":30,
      "date":"2014-09-10",
      "notes":"fzefzef",
      "trim":"third",
      "year":"2014"
   },
   {  
      "projectName":"Nouveau test",
      "clientName":"Nouveau client",
      "typeIncome":"Accompte",
      "amount":16,
      "date":"2014-09-19",
      "notes":"CC",
      "trim":"third",
      "year":"2014"
   },
   {  
      "projectName":"Nouveau projet",
      "clientName":"Nouveau client",
      "typeIncome":"Accompte",
      "amount":1200,
      "date":"2014-05-17",
      "notes":"Chèque cc",
      "trim":"second",
      "year":"2014"
   },
   {  
      "projectName":"Projet test",
      "clientName":"Client test",
      "typeIncome":"Accompte",
      "amount":1500,
      "date":"2014-01-15",
      "notes":"Chèque cc",
      "trim":"first",
      "year":"2014"
   },
   {  
      "projectName":"Deuxième test",
      "clientName":"Deuxième client",
      "typeIncome":"Reliquat",
      "amount":4500,
      "date":"2014-09-27",
      "notes":"Virement",
      "trim":"third",
      "year":"2014"
   },
   {  
      "projectName":"efzefze",
      "clientName":"zfezefzef",
      "typeIncome":"Reliquat",
      "amount":8,
      "date":"2014-09-05",
      "notes":"zefzefzef",
      "trim":"third",
      "year":"2014"
   },
   {  
      "projectName":"Nouveau test",
      "clientName":"Nouveau client",
      "typeIncome":"Reliquat",
      "amount":7,
      "date":"2014-09-27",
      "notes":"LDD",
      "trim":"third",
      "year":"2014"
   }
]

The data structure I want :

[
    {
        year: 2014,
        trim: [
            {
                name : 'first',
                content : [
                    // some content
                ]

            },
            {
                name : 'second',
                content : [
                    // some content
                ]

            }
        ]


    },
    {
        year: 2013,
        trim: [
            {
                name : 'first',
                content : [
                    // some content
                ]

            }
        ]


    }

]

And here's the method I'm using right now :

self.trimestral = function(){
  var deferred = $q.defer();
  self.buildAndGetIncomes().then(function(result) {
    var trimestral = [];
    var incomes = result;


    angular.forEach(incomes, function(income, i){
      var year = income.year,
          trim = income.trim,
          newTrim = {},
          newTrimContent = {};

      if( i === 0 ){
          newTrim.year = year;
          newTrim.trim = [];
          newTrimContent ={};
          newTrimContent.name = trim;
          newTrimContent.content = [];
          newTrimContent.content.push(income);

          trimestral.push(newTrim);
          console.log(trimestral);
          trimestral[0].trim.push(newTrimContent);
      }
      else {
        var maxLength = incomes.length;
        for (var h = 0; h<maxLength; h++){
            if(trimestral[h].year === year){



                for (var j = 0; j<trimestral[h].trim.length; j++){
                  console.log(h,j,trimestral[h].trim[j].name === trim);
                  if(trimestral[h].trim[j].name === trim){ // trimester already exists

                    trimestral[h].trim[j].content.push(income);
                  }
                  else {// trimester doesn't exist, create it
                    var createTrim = {};

                    createTrim.name = trim;
                    createTrim.content = [];
                    createTrim.content.push(income);
                    trimestral[h].trim.push(newTrimContent);
                  }
                }




            }
            else {
             newTrim.year = year;
              newTrim.trim = [];
              newTrimContent ={};
              newTrimContent.name = trim;
              newTrimContent.content = [];
              newTrimContent.content.push(income);

              trimestral.push(newTrim);
              console.log(trimestral);
              trimestral[0].trim.push(newTrimContent);
            }

        }

      }

    });

   deferred.resolve(trimestral);      
  });
return deferred.promise;    
};

This code works as supposed, it checks if we're on the first index of the loop, and it push the year / trimester / content of that trimester. That structure is ok.

Now my problem is I need to check if the year already exists, and then, to check if the trimester exists in that year object, to construct an array of objects like I pasted above.

I tried many ways to do that, but it seems too difficult for my JS skills... Any help ?

Have you tried using the orderBy filter to perform the sorting, either in the ngRepeats or inside your controller? — Anthony Chu, Sep 30 '14 at 16:46
I could use orderBy on a array like I pasted above, but I can't construct it. That's the problem I'm facing. — enguerranws, Oct 1 '14 at 8:14
Can you post the current data structure and the end result you want? — Anthony Chu, Oct 1 '14 at 15:50
I posted it. My question is only about pure JS loop and inner loop I think. But as you can see I'm getting lost into it... — enguerranws, Oct 2 '14 at 9:02

Anthony Chu · Answer 1 · 2014-10-02 16:37:35Z

This is certainly possible using several loops, but the code will be pretty hard to follow. If you're okay with bringing in another library, consider underscore.js. With it, you can do something like this...

var trimestral = _(incomes).chain()
    .groupBy('year')
    .map(function (items, year) {
        return {
            year: year,
            trim: _(items).chain()
                    .groupBy('trim')
                    .map(function(content, trimester) {
                        return {
                            trim: trimester,
                            content: content
                        };
                    })
                    .sortBy(function(i) { 
                        var trimesters = {
                            first: 1,
                            second: 2,
                            third: 3
                        };
                        return trimesters[i.trim];
                    }).value()
        };
    })
    .sortBy('year')
    .value();

Live Demo

I thought about it, I already knew I could use jQuery $.map() to achieve that in an easier way. But I don't want to use another js lib :) Thank you anyway ! — enguerranws, Oct 4 '14 at 11:27

enguerranws · Accepted Answer · 2014-10-08 09:04:42Z

I finally asked a friend who is a good web developer to help me about that. He told me to do that in two steps : construct the object, and then, format it in the way I need.

So I did this :

self.trimestral = function(){
  var deferred = $q.defer();
  var global = [];
  self.buildAndGetIncomes().then(function(result) {
    var trimestral = {};

    var incomes = result;

    // First loop, construct the object
    angular.forEach(incomes, function(income, i){
      var year = income.year,
          trim = income.trim,
          newTrim = {},
          newTrimContent = {};          
          if(trimestral[year] === undefined){
            trimestral['year' , year] = {};

          }
          if(trimestral[year][trim] === undefined) {
            trimestral[year][trim] = [];               
          }
           trimestral[year][trim].push(income);        

    });

   deferred.resolve(global);

   // Second loop, format the data
    for ( prop in trimestral ) {          
      newYear = {};
      newYear.name = prop;
      newYear.content = [];          
      for ( trim in trimestral[prop]){
        newTrim = {};
        newTrim.name = trim;
        newTrim.content = [];           
        newTrim.content = trimestral[prop][trim];              
        newYear.content.push(newTrim);
      }
      global.push(newYear);
    }         
  });
return deferred.promise;    
};

I guess it could be cleaner, but it works and it's much more simple than I expected.

asked	2 years ago
viewed	2322 times
active	2 years ago

current community

your communities

more stack exchange communities

AngularJS : check if key/value exist in object and construct an array of objects

2 Answers 2

Your Answer

Not the answer you're looking for? Browse other questions tagged javascript arrays angularjs or ask your own question.

Linked

Hot Network Questions

current community

your communities

more stack exchange communities

AngularJS : check if key/value exist in object and construct an array of objects

2 Answers 2

Your Answer

Sign up or log in

Post as a guest

Not the answer you're looking for? Browse other questions tagged javascript arrays angularjs or ask your own question.

Linked

Related

Hot Network Questions