multiselect dropdown in angularjs only works on initialization of Controller

Question

I am using jquery, bootstrap multi-select dropdown. I want to populate multi-select dropdown (talukas) on selectionChange event of other normal (single-select) dropdown (city). I am not able to figure out why the multi select dropdown populates on initial load of a controller and why not on selection change of other dropdown. Can you please help me. Thank you.

Scenario - 1 => This works fine

 <div ng-controller="tempController" ng-init="initializeController()" ng-cloak>
         <select id="multiSelect" name="multiSelect" multiselect=""
           multiple="" ng-model="selectedTalukas" ng-options="option.talukaId as 
           option.label for option in talukas"></select>
</div>



 // .js


$scope.selectedTalukas = [];
     $scope.initializeController = function () {            
                            $scope.talukas = [
                              { talukaId: 1, label: 'Taluka1' },
                              { talukaId: 2, label: 'Taluka2' },
                              { talukaId: 3, label: 'Taluka3' }
                            ]
        }

Scenario - 2 => This DO NOT works fine - WHY

 <select id="city" class="form-control select2" name="ddlCity" ng-model="c" ng-options="c as c.name for c in city | orderBy:'name'"
ng-change="selectedCityChange(c)" >  
</select>

 <select id="multiSelect" name="multiSelect" multiselect=""
   multiple="" ng-model="selectedTalukas" ng-options="option.talukaId as 
   option.label for option in talukas"></select>



 $scope.selectedCityChange = function (selectedValue) {
                if (selectedValue !== undefined) {
                    $scope.selectedCity = selectedValue;
                    $scope.selectedCityId = selectedValue.cityId;
                    $scope.ajaxPost(selectedValue.cityId,
                        '/api/Taluka/getTalukasForSelectedCity',
                        $scope.selectedCityChangeComplete,
                        $scope.selectedCityChangeError);
                }
            };

            $scope.selectedCityChangeComplete = function (response) {               
                $scope.talukas = response.data.talukaMasters;          

            }