Learning AngularJS has been my current focus. To practice, I have been working on a Quiz app tutorial. However, I encountered an issue when trying to call the rest function of a factory after injecting it into one of my controllers. The JSON data for this project is sourced from a Spring backend.
results.js:
(function(){
angular
.module("quizApp")
.controller("resultsController", resultsController);
resultsController.$inject = ['quizMetrics', 'dataService'];
function resultsController(quizMetrics, dataService) {
var vm = this;
vm.quizMetrics = quizMetrics;
vm.dataService = dataService;
vm.activeQuestion = 0;
vm.reset = reset;
vm.getAnswerClass = getAnswerClass;
vm.setActiveQuestion = setActiveQuestion;
vm.calculatePerc = calculatePerc;
function getAnswerClass(index) {
if(index === quizMetrics.correctAnswers[vm.activeQuestion]) {
return "bg-success";
} else if (index === dataService.quizQuestions[vm.activeQuestion].selected){
return "bg-danger";
}
}
// More functions here...
}
})();
dataService.js:
(function() {
angular
.module("quizApp")
.factory("dataService", DataFactory);
function DataFactory($http) {
// Implementation of DataFactory with init and getAllQ methods
var dataObj = {
quizData: quizData,
quizQuestions: [],
correctAnswers: []
};
// More functions here...
return dataObj;
}
})();
If I use the getAllQ method instead of the init method, I still encounter the error "getAllQ is not a function" despite other similarly declared functions working as intended.
Thank you in advance for your assistance!