I am currently utilizing a service to make a $http.get request for my object and then transfer it to my controller.
Although the custom service (getService) successfully retrieves the data object and saves it in the responseObj.Announcement variable when I check the scope using Chrome's F12 developer tools, I am having difficulty passing that object to my controller.
- Could there be an issue with one of the methods in either the service or the controller?
I have scoured StackOverflow for similar scenarios but haven't been able to find a solution yet.
getService
class getService {
static $inject = ["$http", "$window"]
baseUrl: string = ConfigB.BaseAPIUrl;
urlObject = {
Announcement: "Announcement",
};
responseObj = {
Announcement :[],
};
constructor(
public $http: any,
private $window: any
) { }
// method using generic promise object for announcements controller
public getAnnouncements() {
this.getRequest(this.baseUrl + this.urlObject.Announcement, "Announcement");
}
public passData() {
return this.responseObj.Announcement;
}
//Generic Angular $http promise object
private getRequest(url: string, responseType:string) {
this.$http.get(url)
.then((response) => {
this.responseObj[responseType] = response.data;
},
function (data) {
this.$window.alert("Error: " + data);
});
}
}
angular.module('App').service("getService", getService);
<strong>My Controller:</strong>
class announcementController {
static $inject = ["$rootScope", "$scope", "$window", "getService" ];
Announcement: any = [
{ Message: "test" }
];
constructor(
public $rootScope: any,
public $scope: any,
private $window: any,
private getService: any
) {}
public getAnnouncements() {
this.getService.getAnnouncements();
}
public setAnnouncements() {
this.Announcement = this.getService.passData();
}
init() {
this.getAnnouncements();
this.setAnnouncements();
}
}
angular.module('App').controller("announcementController", announcementController);