I want to make a regular select list with AngularJs have a preselected option, how do I do that?

Question

And please don't pinpoint me to any other answer. Have tried them all. Ng-repeat is not recommended for select lists, have used ng-options.

Have tried any number of combinations between ng-init, ng-model and ng-options, to no avail.

Here is my html:

    <div class="appFilter" ng-show="visibility">
    <span class="fa {{icon}}"></span>
    <select  name="{{filter_name}}" id="filter_{{filter_name}}"
                    ng-model="model"
                    ng-options="u as u.name for u in list track by u.id"
                   >
    </select>
</div>

here is my model:

[
{prop1:prop1,prop2:prop2,prop3:prop3},
{prop1:prop1,prop2:prop2,prop3:prop3},
{prop1:prop1,prop2:prop2,prop3:prop3},
{prop1:prop1,prop2:prop2,prop3:prop3},
]

And my first selected option is always like value="?" selected="selected". I mean sorry guys, I'm new to Angular, but since when does a framework make it so hard to generate a simple select list?

Thank you guys for having patience with my frustration, I'm going desperate here!

Answer 1

I believe that your problem is that you have a typo in your code.

When you set the $scope.model value you are currently doing

$scope.model = list[0];

When you should be doing

$scope.model = $scope.list[0];

Here is a plunker showing that it works: http://plnkr.co/edit/M6YuyBA4y7G6HIF7Wfrk?p=preview