AngularJS: Pass data from Controller to Service - angularjs

Question

First: Here is a plunk.
Currently I am trying to build a basic sign-up app with AngularJS hosted on a SharePoint site. I am pulling the current user data with a factory like so:
app.factory('Data', function ($http, $log) {
return {
getCurrentUser: function (complete, failure) {
jQuery.ajax({
url: _spPageContextInfo.webAbsoluteUrl + "/_api/Web/currentUser",
type: "GET",
dataType: "json",
headers: {
"Accept": "application/json;odata=verbose"
},
success: function (data) {
complete(data.d);
},
error: function (data) {
failure(data);
}
});
}
I then use a controller to assign the results (in this case the user Title) to a value:
app.controller('IndexCtrl', function ($scope, Data) {
Data.getCurrentUser(function (user) {
CurrentUser = user.Title;
});
Now, the issue I am having is that the value of CurrentUser is not usable in all parts of the factory. Right now, everything is in one factory and one controller. So, I can use CurrentUser to create a new appointment like this:
app.factory('Data', function ($http, $log) {
return {
updateAppointment: function (appointment) {
var Title = appointment.Title;
var Appointment = appointment.Appointment;
var CurrentSpots = appointment.Openings;
var Id = appointment.Id;
// Create new Reservations list item
jQuery.ajax({
url: _spPageContextInfo.webAbsoluteUrl + "/_api/Web/Lists/getByTitle('SharePointList')/Items",
type: "POST",
data: JSON.stringify({
"__metadata": { type: "SP.Data.SharePointListItem" },
Title: Title,
Appointment: Appointment,
Colleague: CurrentUser,
AppointmentId: Id
}),
headers: {
"Accept": "application/json;odata=verbose",
"Content-Type": "application/json;odata=verbose",
"X-RequestDigest": jQuery("#__REQUESTDIGEST").val()
},
success: function (data, textStatus, jqXHR) {
},
failure: function (jqXHR, textStatus, errorThrown) {
var response = JSON.parse(jqXHR.responseText);
var message = response ? response.error.message.value : textStatus;
alert("Error: " + message);
}
});
But I cannot seem to use it when I try to do a query including that CurrentUser value in something like this:
app.factory('Data', function ($http, $log) {
return {
getCurrentAppointment: function (successCallback) {
$http({
url: _spPageContextInfo.webAbsoluteUrl + "/_api/Web/Lists/getByTitle('SharePointList')/Items?$filter=User eq '" + CurrentUser + "'",
method: "GET",
dataType: "json",
async: "true",
headers: {
"Accept": "application/json;odata=verbose"
}
})
.success(function (data, status, headers, config) {
successCallback(data.d.results);
})
.error(function (data, status, headers, config) {
$log.warn(data, status, headers, config);
});
}
No matter what I've tried, it consistently gives me an undefined return for that CurrentUser value. Any help would be appreciated. Thank you in advance!

Answer 1

You don't demonstrate where you are declaring CurrentUser (eg var CurrentUser;) (I couldnt see it).
I trust you are not using a global variable (evil).
Also it is unclear where you are invoking these factory methods that are accessing CurrentUser. You are assigning CurrentUser inside the Data.getCurrentUser invocation in your controller. Assuming you have declared CurrentUser outside that function somewhere, it will not be assigned until the asynchronous request has completed. I'd suggest refactoring your method updateAppointment to receive the CurrentUser parameter instead of relying on outside scope.