Nested .each loop using underscore.js

Question

How can I write this code in underscore.js?

for(var i=0; i<scope.courseContent.sections.length; i++){
        if(scope.courseContent.sections[i].pages.length){
            ctrl.pages.push({'content': scope.courseContent.sections[i].content});
            for(var j=0; j<scope.courseContent.sections[i].pages.length; j++){
                ctrl.pages.push({'content':scope.courseContent.sections[i].pages[j].content});
            }
        }
        else{
            if(scope.courseContent.sections[i].title == 'Course Title' || scope.courseContent.sections[i].title == 'Introduction'){
                ctrl.pages.push({'content':scope.courseContent.sections[i].content});
            }
        }
}

I tried this using nested .each loop but this isnt woking. Heres my approach:

_.each(scope.courseContent.sections, function(sections){
        if(sections.pages.length){
            ctrl.pages.push({'content': scope.courseContent.sections.content});
            _.each(sections.pages, function(page){
                ctrl.pages.push({'content':scope.courseContent.sections.pages.content});    
            });
        }
        else{
            if(scope.courseContent.sections.title == 'Course Title' || scope.courseContent.sections.title == 'Introduction'){
                ctrl.pages.push({'content':scope.courseContent.sections.content});
            }
        }
});

T J · Accepted Answer · 2016-03-09 12:20:46Z

The problem is that sections, pages etc are arrays, in the original code since we're using for loop, items are accessed using iteration index like scope.courseContent.sections[i].content, but with your underscore attempt, you're trying to access properties of each item directly from the arrays using . which won't work as expected.

When you use underscore, you get each item as the first argument to call back, So I think your code should be:

_.each(scope.courseContent.sections, function(section) {
  if (section.pages.length) {
    ctrl.pages.push({
      'content': section.content
    });
    _.each(section.pages, function(page) {
      ctrl.pages.push({
        'content': page.content
      });
    });
  } else if (section.title == 'Course Title' || section.title == 'Introduction') {
      ctrl.pages.push({
        'content': section.content
      });
    }
});

or you can add a second parameter in your callback signature, which will be the index of current item, like:

_.each(scope.courseContent.sections, function(section,i) {

and acceess items with index just like original code: scope.courseContent.sections[i].content, but that's unnecessary.

Collectives™ on Stack Overflow

Nested .each loop using underscore.js

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related