I'm trying to load dropdown from database, don't know what causes the problem but can't see it loaded or returned from webservice.

I created a separate webapi project and when I call the api method directly from my browser it does reutrn a data in JSON format as below

    <ArrayOfGetCustomersList_Result xmlns:i="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://schemas.datacontract.org/2004/07/Repository">
<GetCustomersList_Result>
<cust_name>Alex Fraser Group : Alex Fraser</cust_name>
<custid>Alex Fraser</custid>
<customer_auto>24</customer_auto>
</GetCustomersList_Result>
<GetCustomersList_Result>
<cust_name>BMA : BMA</cust_name>
<custid>BMA</custid>
<customer_auto>16</customer_auto>
</GetCustomersList_Result>
<GetCustomersList_Result>
<cust_name>DEMO CUSTOMER 1 : DEMO CUSTOMER 1</cust_name>
<custid>DEMO CUSTOMER 1</custid>
<customer_auto>1</customer_auto>
</GetCustomersList_Result>
<GetCustomersList_Result>
<cust_name>Hydraulink Toowoomba : Hydraulink Toowoomba</cust_name>
<custid>Hydraulink Toowoomba</custid>
<customer_auto>21</customer_auto>
</GetCustomersList_Result>
<GetCustomersList_Result>
<cust_name>QA Trackspares : QA Trackspares</cust_name>
<custid>QA Trackspares</custid>
<customer_auto>22</customer_auto>
</GetCustomersList_Result>
<GetCustomersList_Result>
<cust_name>Timms Contracting : Timms</cust_name>
<custid>Timms</custid>
<customer_auto>23</customer_auto>
</GetCustomersList_Result>
<GetCustomersList_Result>
<cust_name>UNKNOWN : UNKNOWN</cust_name>
<custid>UNKNOWN</custid>
<customer_auto>17</customer_auto>
</GetCustomersList_Result>
</ArrayOfGetCustomersList_Result>

My Angular Service code is:

var app = angular.module('dashboardModule', ['oc.lazyLoad', 'directive.contextMenu'])
.service('dashboardService', ['$http', function ($http) {

    this.loadCustomers = function (onSuccess, onError) {

        onError = onError || function () { alert('Failure getting customers'); };
        $http
            .get('http://localhost:7999/api/dashboard/GetCustomersList')
            .success(onSuccess)
            .error(onError);
    };

}]);

I'm calling this from my Angular controller as:

angular.module('dashboardModule')
        .controller('dashboardController', ['$scope', '$rootScope', '$location', '$translate', 'dashboardService', function ($scope, $rootScope, $location, $translate, dashboardService) {

        $scope.customers = [];
        dashboardService.loadCustomers(customersLoaded,erroroccured);

        function erroroccured(response)
        {
            alert(response.data);
        }
        function customersLoaded(response) {
            $scope.customers=response.data;
        }

        $scope.selectedCustomer = $scope.customers[0].customer_auto;
    }
]);

and on my html page i'm trying to load it as

<div class="col-sm-2"><select class="form-control" ng-model="selectedCustomer" ng-options="customer.customer_auto as (customer.custid+':'+customer.cust_name) for customer in customers">></select></div>

can somebody tell me what's the issue in the code. I do get this error in IE debugger

Unable to get property 'customer_auto' of undefined or null reference