I am struggling to populate a select form element. Here is the syntax that I have so far. It will not grab the program.title and populate the ngOptions.
<select ng-model="student.program" ng-options="program.title for program in programList.title">
<option value="">Select A Program</option>
</select>
Here is the basic JSON structure of my data on Firebase:
{
"-JNIBeRDAuNN9c7SGZ91" : {
"location" : "Online",
"director" : "Shawn Clark",
"title" : "Web Design & Development"
},
"-JNIBuaQlWyEyWRjONPa" : {
"location" : "Online",
"director" : "Walen Morrow",
"title" : "Graphic Design"
},
"-JNIBmIwasMYOPRPupHl" : {
"location" : "Campus",
"director" : "Tracy Monohan",
"title" : "Web Design & Development"
},
"-JNKGPNj-lGzqHJ92RTD" : {
"location" : "Online",
"director" : "Glen Speedy",
"title" : "Theory of Animation & Physics"
},
"-JNK9oTO97PfSo-0wQfY" : {
"location" : "Campus",
"director" : "John Myers",
"title" : "Instructional Design & Technology"
},
"-JNIC3Tldo-Qi3ru2ph7" : {
"location" : "Campus",
"director" : "George Narrow",
"title" : "Graphic Design"
},
"-JNK8cdgdHKjH2meKl9x" : {
"location" : "Online",
"director" : "Stacy McNally",
"title" : "Instructional Design & Technology"
}
}
I believe you are looking for
<select ng-model="student.program" ng-options="program.title for (id, program) in programList"><option value="">Select A Program</option></select>
Your JSON's root object is an object, not an array. See angular documentation for object data sources
See Plunker
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With