<pre lang="HTML">
<ul>
<li data-ng-repeat="q in QuizObj">
<fieldset><legend>All Quizes </legend>
<h1>{{q.Quiz }}</h1>
<h3>options</h3>
<h3>answer</h3>
<input type="radio" />{{q.options[1]}}
<input type="radio" />{{q.options[2]}}
<input type="radio" />{{q.options[3]}}
<input type="radio" />{{q.options[4]}}
<h4>Answer</h4>
<input type="radio" />{{q.answer}}
</fieldset>
</li>
</ul>
<input type="text" ng-model="ans">
<input type="text" ng-model="Question" >
<input type="text" ng-model="type">
<input type="button" data-ng-click="addQuiz()">
and this is js angular code
angular.module('quizApp',[])
.controller('mainCtrl',function($scope,crudService){
$scope.name="this";
alert(JSON.stringify(crudService.quiz));
$scope.QuizObj= crudService.quiz;
})
.service('crudService',function(){
this.quiz=[
{
Quiz: "what is the C#",
options: { 1: 'P-lang',
2:'h-lang',
3: 'A-lang',
4: 'nothing'
},
type: 'radio',
answer: 1
},
{
Quiz: "what is the J#",
options: { 1: 'P-lang',
2:'h-lang',
3: 'A-lang',
4: 'nothing'
},
type: 'radio',
answer: 1
},
{
Quiz: "what is the VB",
options: { 1: 'PL',
2:'hL',
3: 'AL',
4: 'nothing'
},
type: 'radio',
answer: 1
}
]
})
i am encountering an issue while attempting to dynamically add questions to the quiz object that resides within a service. How can I achieve this? i have written the following function for adding new questions:
$scope.addQuiz= function($scope){
crudService.quiz.push({
Quiz: $scope.Question,
type: $scope.type,
answer: $scope.ans
})
}
However, I am facing the error message: TypeError: Cannot read property 'Question' of undefined How can I successfully push new data into the service's object (quiz)? Furthermore, how do I add options to each question in the quiz object? Additionally, I would like to give users the ability to specify the type of answer, such as true/false (checkbox), multiple answers (checkbox), or single answer (radio buttons). How can I implement this and structure the layout accordingly?