Send data to controller on ui.select angular

i'm trying to select a value from dropdown list and get the data from corresponded select id in angularJs

i have came up with angular-ui/ui-select directives

<ui-select ng-model="customer" theme="selectize">
     <ui-select-match placeholder="Customer List">{{$select.selected.Name}}</ui-select-match>
        <ui-select-choices repeat="customer in customers | filter: $select.search">
            <span ng-bind-html="customer.Name | highlight: $select.search"></span>
            <small ng-bind-html="customer.Id.toString() | highlight: $select.search"></small>
        </ui-select-choices>
</ui-select>

on my controller i have get customer method

$scope.setActiveCustomer = function(customer) {
  customersService.getCustomers(customer).then(function(response) {
    $scope.selectedCustomer = response;
  });
};

my problem is

• once i select the customer which event should i use for fire setActiveCustomer (like onchange or something). when i use ng-click event fired many time because ng-click using to control activate.

• other thing is how can i set initial value for ui-select ?

thanks

According to the ui-select FAQ, your ng-model expression should have a . in it, for example:

<ui-select ng-model="model.customer" theme="selectize">

To set the initial value, you could just set the property specified in the ng-model, so in your controller:

$scope.model = {
  customer: $scope.customers[0] // set the initial selected option
};

For the onchange event, you could use $scope.$watch() like this:

$scope.$watch('model.customer', function (customer) {
  $scope.setActiveCustomer(customer);
});

Hope this helps.