I have been struggling to pass two variables from an angular service to an MVC controller, but I keep encountering errors. The latest error I'm getting is that 'compName' doesn't exist. I've spent hours trying to debug the issue using the Angular debugger, but so far, no luck.
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;
}
}]);
I believe the issue may be related to the fact that the angular controller is attempting to call the service on load rather than on click. However, I'm not sure how to address that.
This is the code for my angular controller and service:
myApp.controller('myController', ['$scope', 'getDocTypesService',
function ($scope, getDocTypesService) {
$scope.docSettings = '';
getDocTypesService.getDocTypes(compName, custName).then(function (value) {
$scope.docSettings = value
})
};
}
]);
Here's the HTML snippet:
<select ng-model = "selectedDocument" ng-click="getDocTypes(selectedCompany, enteredCustomer)">
<option>Select document</option>
<option ng-repeat="docSetting in docSettings" value=" {{docSetting.Doc_Type}}">{{docSetting.Doc_Type}}</option>
</select>