How to read JSON data into an HTML Select Element in a Meteor app?

Question

I want to load some "lookup table"-type stuff, which I've stored in a file named "settings.json" in my Meteor app. The json is:

[{
    "uccampus": [
      "UC Santa Cruz",
      "UC Berkeley",
      "UC Davis",
      "UC Irvine",
      "UC Los Angeles",
      "UC Merced",
      "UC Riverside",
      "UC San Diego",
      "UC San Francisco",
      "UC Santa Barbara"
    ]
}]

I want to load this data into a template named "tblTravelerInfo2", so I've got this code in the .js file:

Template.tblTravelerInfo2.helpers({
  uccampuses: function(){
    return Meteor.settings.uccampuses;
  }
});

...and this in the corresponding template in the html file:

<select name="selectcampus" id="selectcampus" title="Please select a campus">
    {{#each uccampus}}
      <option>{{what}}</option>
    {{/each}}
</select>

As you might be able to suss out, I don't know what should go where I put "{{what}}" as a placeholder. What should it be?

UPDATE

It's still not working. This is now my json:

[{
    "uccampus": [
    {name:"UC Santa Cruz"},
    {name:"UC Berkeley"},
    {name:"UC Davis"},
    {name:"UC Irvine"},
    {name:"UC Los Angeles"},
    {name:"UC Merced"},
    {name:"UC Riverside"},
    {name:"UC San Diego"},
    {name:"UC San Francisco"},
    {name:"UC Santa Barbara"}
    ]
}]

...and this is the helper:

  Template.tblTravelerInfo2.helpers({
    uccampuses: function(){
      return Meteor.settings.uccampuses[0];
    }
  });

I've also tried:

  Template.tblTravelerInfo2.helpers({
    uccampuses: function(){
      return Meteor.settings.uccampus[0];
    }
  });

...and this is the HTML:

{{#each uccampus}}
    <option>{{name}}</option>
{{/each}}

I also tried this as the HTML:

{{#each uccampuses}}
    <option>{{uccampus.name}}</option>
{{/each}}

...but in both cases the Select Options are not populated. No err msg, but no population, either.

UPDATE 2

I started the app with "meteor --settings settings.json" and got this in the console:

C:\Meteor\scheduler>meteor --settings settings.json [[[[[ C:\Meteor\scheduler ]]]]]

=> Started proxy. => Started MongoDB. => Errors prevented startup:

While preparing to run: settings.json: parse error reading settings file

=> Your application has errors. Waiting for file change.

Here is the settings file in its entirety:

"public" : { "uccampus": [ {"name":"UC Santa Cruz"}, {"name":"UC Berkeley"}, {"name":"UC Davis"}, {"name":"UC Irvine"}, {"name":"UC Los Angeles"}, {"name":"UC Merced"}, {"name":"UC Riverside"}, {"name":"UC San Diego"}, {"name":"UC San Francisco"}, {"name":"UC Santa Barbara"} ] }

Answer 1

Since you are accessing Meteor.settings on the client you need to include your data in a public key as follows:

settings.json

"public" : {
    "uccampus": [
    {"name":"UC Santa Cruz"},
    {"name":"UC Berkeley"},
    {"name":"UC Davis"},
    {"name":"UC Irvine"},
    {"name":"UC Los Angeles"},
    {"name":"UC Merced"},
    {"name":"UC Riverside"},
    {"name":"UC San Diego"},
    {"name":"UC San Francisco"},
    {"name":"UC Santa Barbara"}
    ]
}

In your helper call on this public settings like this:

  uccampus: function(){
    return Meteor.settings.public.uccampus;
  }

Finally in spacebars call the data like this:

{{#each uccampus}}
    <option>{{name}}</option>
{{/each}}