JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<div ng-app="myApp" ng-controller="MyCtrl">
    <select class="selectList" ng-repeat="currId in selectedIds" ng-model="selectedIds[$index]"  ng-options="currOption.id as currOption.value for currOption in myObj | myfilter:selectedIds:$index" data-ng-change="fixIE()"></select><br>
    {{selectedIds}}
</div>

JavaScript

function MyCtrl($scope, $timeout) {
    $scope.selectedIds = ["C", "E", "F", "G"];

    $scope.myObj = [{
        id: "A",
        value: "AAA"
    }, {
        id: "B",
        value: "BBB"
    }, {
        id: "C",
        value: "CCC"
    }, {
        id: "D",
        value: "DDD"
    }, {
        id: "E",
        value: "EEE"
    }, {
        id: "F",
        value: "FFF"
    }, {
        id: "G",
        value: "GGG"
    }];

    $scope.fixIE = function () {
        $timeout(function () {
            angular.forEach($("select"), function (currSelect) {
                currSelect.options[currSelect.selectedIndex].text += " ";
            });
        });

    };
}

angular.module("myApp", [])
    .filter("myfilter", function () {

    function isIdInUse(selectedIds, id) {
        var retVal = false;
        angular.forEach(selectedIds, function (currentSelectedId) {
            if (id == currentSelectedId) {
                retVal = true;
            }
        });
        return retVal;
    }

    return function (allOptions, selectedIds, index) {

        var newOptions = [];

        angular.forEach(allOptions, function (currentOption) {

            if (currentOption.id == selectedIds[parseInt(index)] || !isIdInUse(selectedIds, currentOption.id)) {
                newOptions.push(currentOption);
            }
        });

        return newOptions;
    };
});