AngularJS drop down (ng- options) not binding - string to object (initial selection)

Question

I am having a problem binding data retrieved from the server to a drop down list. The main issue I think is the fact that the comparison is done on differing object types.

Answer 1

I have had the same problem, ng-model and ng-option being from 2 different sources. My ng-model is bound to a value in a json object representing a chosen filename and my ng-option is a list of possible values taken from a csv file.

In the controller I am reading a directory via a Nodejs route, and creating a json array of filenames like this

var allCsvFiles = [{"name":"file1.csv"},{"name","file2.csv},etc..]

The current csv file, i.e. the selected one is stored in another json array

[{"date":"01-06-2017","csvfile":"file1.csv","colour":"red"},{...}, etc].

I was using the following code for the dropdown:

Which caused the current selection to be blank and if I selected an item from the dropdown it put [object],[object] as the current selection. If I stepped through the code I found that it seemed to be selecting {"name","file1.csv"} as the option and couldn't display it, this seemed odd as my ng-options selection looks like it should just return the value of "name" not the array entry. I tried many different ways to make this work but eventually I found that if I made the list of possible selections a plain javascript array:

var allCsvFiles = ["file1.csv","file2.csv", "file3,csv] 

and changed the select to:

then the dropdown selection worked as expected.

I may have missed some other obvious solution here, but as the array of json objects is one dimensional anyway it doesn't seem to be an issue.

It looks like the OPs question has been answered, I just thought I'd add this as it solved it for me.