Drop down not getting displayed

Problem Question -

I have a two drop down in my view. And second drop down rely on the first one. But somehow second one does not get updated

// my firstdrop down

  <select ng-controller="myController"
             ng-options="customer.name for customer in customerDetailData"  ng-model="customer"
             ng-change="updateCost(customer)">
                <option value="">Please select customer</option>
    </select>

// my second drop down

<select ng-controller="myController"
         ng-options="cc.name for cc in customerCostData">
      <option value="">Please select cost</option>
</select>

// my controller

(function() {
    var myController = function($scope,Service){
        $scope.customerDetailData;
        Service.cust()
            .success(function(data){
                console.log(data)
                $scope.customerDetailData = data;
            })
            .error(function(status,error){

            })

        $scope.customerCostData;
        $scope.updateCost=function(customer){
            Service.cost(customer.id)
                .success(function(cost){
                    $scope.customerCostData= cost
                })
                .error(function(status,data){
                    console.log(status);
                    console.log(data);
                })
        }
    };
    myController .$inject = ['$scope','Service'];
    angular.module('app').controller('myController ',myController );
}());

Is anything i am missing ? the data is coming through fine in the console. Please guide me