Angularjs default value for bound select [duplicate] - combobox

Question

This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
How to make a preselection for a select list generated by AngularJS?
In the angular tutorial they set a sortOrder scope variable that defaults the sort by select to 'Newest'.
In my fiddle I am doing similar but my select value is not selected. Instead i get the blank entry as if i did not set any value in the scope. Yet I can see my sort order and i am emitting the value of the select and it is preset.
//set a default this way also, but not updating the dropdown
$scope.ddlFilter = {
name: "All Open Events",//doesn't matter what this is, only cares about value
value: "ALL"//"OPEN"
};
I know i can use ng-init to set defaults but i want to be able to do it this way as well.
Any suggestions?

Answer 1

Try using an object instead of an array of objects. It will allow you to reference what you want by a string vs. an array position such as scope.eventFilters[0].
$scope.eventFilters = {
"OPEN": "All Open Events",
"UNMAPPED": "All Un-Mapped Events",
"MAPPED": "All Mapped Events",
"CLOSED": "All Closed Events (past 8 hours)",
"ALL": "All Events",
"OTHER": "Other OpCenter Open Events"
};
And then define the default value as a string (key for the object above):
$scope.ddlFilter = "MAPPED";
And then on the page change your select to
<select ng-model="ddlFilter" ng-options="k as v for (k, v) in eventFilters"></select>
and your filter no longer needs a .value, so it will become:
<tr ng:repeat="event in events | myEventFilter:ddlFilter | orderBy:sort.column:sort.descending">
See your modified code working here: http://jsfiddle.net/WXLte/2/