Unpack array of objects into strings to display on a template in meteor

Question

I have a collection that has within it an object that holds an array of yet more objects that need to be unpacked to display in a template eventually.

The item in the sub-object is an order, and the order contains an array of line items.

I can get the order out fine, and see the array of line items no problem, but that's where I come unstuck.

I thought the following would work (using js to convert them into an array of strings to then display somehow)

Template.editEvent.helpers({
    lineItems: function(req) {
        var order = req.order;
        console.log(order);
        var lines;
        var count = 1;

        _.each(order, function(item) {
            var string;
            string +count++ + '. ';
            if(item.age) { // we have a cloathing string
                string += item.age + " " + item.sex + " " + item.Season + " " + "Number: " + item.Number;
                lines.push(string);
            }
            else if(item.pushers) {
                string += "Pushers needed: " + item.pushers;
                lines.push(string);
            }
            else if(item.cots) {
                string += "Cots needed: " + item.pushers;
                lines.push(string); 
            }
            else if(items.extra) {
                string = "Extra info: " + item.extra;
                lines.push(string);
            }   
            else {
                string = "Don't know this field";
                lines.push(string);
            }
            console.log(lines);
        });
        return lines;
    }
})

Where the tests are to see if the line item starts with the field shown (because the line items can be different).

However, the _.each is throwing up on the client, (it works fine in the startup code, so I guess from that its server only?)

Am I barking up the wrong tree here, should this embedded object be a new collection? If I am right, how do I go about displaying the returned string array (only just thought of this) in the template anway?

you are not initializing lines. use var lines = []; also, what is: string +count++ + '. '? did you mean string += count++ + '. '? If so then you also need to initialize string (e.g., = ""). — Christian Fritz
– Christian Fritz, Commented Feb 25, 2014 at 3:24
Christian, please make this an answer so that I can accept it. Your fantastic. One last question. I now have an array of strings.. how do I display them one to a line in the template?? Not sure how to go about that. — Peter Nunn
– Peter Nunn, Commented Feb 25, 2014 at 3:39

Christian Fritz · Accepted Answer · 2014-02-25 04:53:09Z

You are not initializing lines. Use:

var lines = [];

also, what is: string +count++ + '. '? did you mean string += count++ + '. '? If so then you also need to initialize string, e.g., var string = "";

From your comment, I get the sense that what you really want is to show the list reactively in the template. For that, you'd probably want to directly use a transform. Here is how that could work. Alternatively you could wrap your code into a Deps.autorun.

HTML (e.g., edit_event.html):

<template name="editEvent">
    {{lines}}
</template>

Javascript (e.g., edit_event.js):

Template.editEvent.lines = function() {
    var order = Orders.find(
        {id: Session.get('currentOrder')}, 
        {limit: 1,
         transform: function(order) {
             console.log(order);
             var lines;
             var count = 1;

             _.each(order, function(item) {
                 var string = count++ + '. ';
                 if(item.age) { // we have a cloathing string
                     string += item.age + " " + item.sex + " " 
                         + item.Season + " " + "Number: " + item.Number;
                     lines.push(string);
                 }
                 else if(item.pushers) {
                     string += "Pushers needed: " + item.pushers;
                     lines.push(string);
                 }
                 else if(item.cots) {
                     string += "Cots needed: " + item.pushers;
                     lines.push(string); 
                 }
                 else if(items.extra) {
                     string = "Extra info: " + item.extra;
                     lines.push(string);
                 }   
                 else {
                     string = "Don't know this field";
                     lines.push(string);
                 }
                 console.log(lines);
             });
             return lines;
         }
        })
}

This is an awsome answer, thanks. Got one issues still though, what I'm getting in {{lines}} in an array of strings, which, I guess as would be expected prints one sting concatenated straight onto the end of the next. Is there a way I can get at the strings individually in the array using an #each or something so that I can put them on a line each with a checkbox or some other control at the end of it?

Collectives™ on Stack Overflow

Unpack array of objects into strings to display on a template in meteor

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related