Here is my perspective
<div ng-if="isMultiChoiceQuestion()">
<li class="displayAnswer" ng-repeat="choice in getMultiChoice() track by $index" ng-if="isNotEmpty(choice.text.length)">
<input type="checkbox" ng-checked="checkForSelection(choice.id)"
value="choice.text" disabled="true">
<span ng-class="getCSSClass($index, choice.id)">{{choice.text}}</span>
</li>
</div>
<a class="weiter-link" ng-click="flipBack()">Zur Frage</a>
<div ng-if="isMultiChoiceQuestion()">
<!--Changed ng-bind getScore() -> score -->
<h4>Bewertung speichern: <span ng-bind="getScore()"></span></h4>
<br />
<a class="weiter-link" ng-click="incrementOne()">Zur nächsten Frage</a>
</div>
<div ng-if="!isMultiChoiceQuestion()">
<h3>Eigene Bewertung: {{score}}</h3>
<div class="ranger">
<input type="range" max="10" min="0" step="1" id="selfRanger" ng-model="score">
</div>
<a class="weiter-link" ng-click="submitScore(score)">Bewertung speichern</a>
<a class="weiter-link" ng-click="incrementOne()">Zur nächsten Frage</a>
</div>
The above view creates three scopes. One for the controller, another for the first div, and the third for the second div. The issue lies with the property called "score" in the controller not being utilized in the second div.
How can we make the second div utilize the controller's property instead of automatically creating its own property?
JavaScript
app.controller("QuizController", ['total', '$scope', '$rootScope', 'quizDataService', 'QAPointerChange', 'QAScoreList', function (total, $scope, $rootScope, quizDataService, QAPointerChange, QAScoreList) {
$scope.getScore = function()
{
// Makes a call to getCurrentScore and returns a value
$scope.getCurrentScore();
return QAScoreList.getSpecificItemScore(QAPointerChange.getQAPointer());
}
$scope.score = 0;
$scope.submitScore = function (newScore)
{
QAScoreList.setSpecificItemScore(QAPointerChange.getQAPointer(), Number(newScore));
}
$scope.getCurrentScore = function()
{
$scope.score = QAScoreList.getSpecificItemScore(QAPointerChange.getQAPointer());
}
}
This is not a complete JS file. The controller has all services responsible for making calls to fetch scores and other data from services.