AngularJS Select ng-model $index bug

Using array[$index] as ng-model for multiple selects generated by an ng-repeat reveals a bug causing the same value to be selected in the next select elements.

HTML

<div ng-controller="Ctrl">

    <div ng-repeat="country in countries">
       <input type="text" ng-model="selectedCountries[$index]"
       value="{{selectedCountries[$index]}}"> 
    </div> 
    
    <ul>
    
    
    <li>
    {{ selectedCountries[0]}}
    </li>
    <li>
    {{ selectedCountries[1]}}
    </li>

    <li>
    {{ selectedCountries[2]}}
    </li>
    <li>
    {{ selectedCountries[3]}}
    </li>

</ul>
</div>

JavaScript

function Ctrl($scope) {
    
    // select options
    $scope.countries = ['usa', 'canada', 'mexico', 'france'];
    
    // select models
    $scope.selectedCountries = [ 'usa', 'canada', 'mexico' ];
    //$scope.selectedCountries=[];
    
}