After spending hours searching, I'm unable to find a solution to my problem. I was able to implement it before but lost the code and can't remember how I did it.
I need to display only certain array values in a select box using ng-options. The data I have is:
$scope.chartList = [ { "id" : 1, "name" : "chart 1", "order" : 1, "active" : false },
{ "id" : 2, "name" : "chart 2", "order" : 2, "active" : true },
{ "id" : 3, "name" : "chart 3", "order" : 3, "active" : true },
{ "id" : 4, "name" : "chart 4", "order" : 4, "active" : true },
{ "id" : 5, "name" : "chart 5", "order" : 5, "active" : true } ];
The HTML looks like this:
<select ng-model="toAddChart" ng-options="chart.id as chart.name for chart in chartList | filter:chart.active=='false'">
<option value=""></option>
</select>
I want to only show items in the select list where the attribute "active" is false. I've tried various options of the filter attribute without success.
I recall that using ng-repeat in the <option> tag with ng-show is not the correct way to do this, according to what I read somewhere. Using ng-options is supposed to be the proper method.
I'm sure I was able to achieve this without creating a custom JavaScript filter in the past, but I can't remember how. Any assistance would be greatly appreciated.
Update:
I think I figured it out.
Instead of:
filter:chart.active=='false'
It should be:
filter:chart.active='false'
The number of equal signs was the issue. *facepalm*
Thank you to everyone who responded.