Angularjs Binding Dropdown using ng-options

Question

I have looked at the angular documentation https://docs.angularjs.org/api/ng/directive/ngOptions but still can't figure this one out.

I have a list of sexes that get bound to a select like this:

            $scope.sexes = jQuery.grep(formData, function(a) {
                return (a.category == "Sex");
            });

the JSON for the sex list looks like this:

            2: Object
            alternateCode: null
            category: "Sex"
            code1: "F"
            codeID: 60002
            description: "Female"
            lastModifiedBy: ""
            lastModifiedDate: "1900-01-01T00:00:00"
            subCategory: null

The member object that should make the select choice has a property on it sex:M . The problem is when I try to bind the select it will populate the list correctly but will not select the option I need:

            <select name="sex" id="sex" class="form-control"
                    ng-model="editableMember.sex"
                    ng-options="s.sex as s.description for s in sexes track by s.code1 "></select>

Any help would be greatly appreciated

Answer 1

Perhaps you missed this part of the documentation:

Do not use select as and track by in the same expression. They are not designed to work together.

The ng-model value will be the result of either the select or track by expression. The following code for ng-options should work:

ng-options="s.code1 as s.description for s in sexes"