Ng-models not accessible - angularjs

Question

One of the ng-models gives null value. When I click the button with the function setNewRecord the parameter selectedDocument is null. The first two parameters are correct. The javascript code is added as well.
<form name="myForm" >
<div>
<select ng-model="selectedCompany">
<option value="">-- Select Company --</option>
<option data-ng-repeat="currentSetting in currentSettings" value={{currentSetting.SCACCode}}>{{currentSetting.SCACCode}}</option>
</select>
</div>
<div><input id="Text1" type="text" ng-model="enteredCustomer"/></div>
<div>
<select ng-model="selectedDocument" ng-click="getTypes(selectedCompany, enteredCustomer)">
<option value="">-- Select Doc type --</option>
<option data-ng-repeat="docSetting in docSettings" value="{{docSetting.Doc_Type}}">{{docSetting.Doc_Type}}</option>
</select>
</div>
<input id ="btnAdd" type="button" value="Add new record" ng-click="setNewRecord(selectedCompany, enteredCustomer,selectedDocument)"/>
Java Script
myApp.service('getDocTypesService', ['$http', '$q', function($http, $q) {
var allSettings = null;
this.getDocTypes = function(compName, custName) {
var def = $q.defer()
if (allSettings) {
def.resolve(allSettings);
} else {
$http.post('GetDocTypes', {
companyName: compName,
customerName: custName
})
.then(function(response) {
var response = $.parseJSON(response.data)
allSettings = response;
def.resolve(allSettings);
});
}
return def.promise;
}
}]);
myApp.controller('myController', ['$scope', 'getDocTypesService',
function($scope, getDocTypesService) {
$scope.getTypes = function(comp, cust) {
getDocTypesService.getDocTypes(comp, cust).then(function(value) {
$scope.docSettings = value
});
};
}
]);

Answer 1

Try replacing the select for selectedDocument with this:
<select ng-model="selectedDocument"
ng-click="getTypes(selectedCompany, enteredCustomer)"
ng-options="docSetting.Doc_Type for docSetting in docSettings track by docSetting.Doc_Type">
</select>