what is the scope for ui-select2 ng-model

Question

I am running in to a strange problem and unable to understand whats going on.

I an using the following code

<select ui-select2 class="span4" multiple 
    ng-model="WhseAssociations" 
    ng-change="valueChanged(WhseAssociations)"
    data-placeholder="Select associated warehouses" 
    ng-options="whse.WarehouseName for whse in allShipperWarehouses">
</select>

on the controller I have

$scope.WhseAssociations = new Array();

$scope.valueChanged = function(whse){
   alert(angular.toJson(whse));
}

the changes made to the selection is not reflected in the WhseAssociations variable of the $scope when i am referring it at a later time, however inside the valueChanged(whse) function the whse is fully populated but the $scope.WhseAssociations is not populated.

so the question I have is what is the scope of this WhseAssociations and how can I access this inside my controller?

Answer 1

ui-select2 is incompatible with <select ng-options>, as per the project description at https://github.com/angular-ui/ui-select2#working-with-dynamic-options

This should do it:

<select ui-select2 class="span4" multiple 
    ng-model="WhseAssociations" 
    ng-change="valueChanged(WhseAssociations)"
    data-placeholder="Select associated warehouses">
<option value=""></option>
<option ng-repeat="whse in allShipperWarehouses">{{whse.WarehouseName}}</option>
</select>