Могу ли я спросить, есть ли способ захватить последний выбранный переключатель в AngularJS?
Например, у меня есть следующий код, который отображает четыре переключателя:
<li ng-repeat="query in carousel.currentQuestionObject.choices" style="padding-bottom:5px;">
<input class="TWInputField"
name="{{carousel.currentQuestionObject.name}}"
type="{{carousel.currentQuestionObject.inputType}}"
id="{{query.id}}"
ng-model="carousel.checkboxCollection[query.id]"
ng-value="{{carousel.currentQuestionObject.value}}">
<label for="{{query.id}}"
style="font-family:'MetricWeb-Regular';
font-size:17px;cursor:pointer">
{{query.question}}
</label>
Сначала я выбрал радио №3, но вместо этого передумал и выбрал радио # 4. Затем я нажал кнопку "Далее" на этой странице.
<div class="carousel-wizard-buttons"
ng-click="carousel.wizardNext(carousel.checkboxCollection)"
ng-hide="carousel.currentQuestionIndex == carousel.wizardQuestionSet.length - 1">
Next
</div>
Моя проблема заключается в том, что после проверки checkboxCollection я увидел, что значения для переключателей 3 и 4 являются истинными, хотя я выбрал только # 4. Есть ли способ сообщить моей программе, что значение # 3 уже неверно?
Для вашей справки, вот что я пытался сделать (что не сработало...):
vm.wizardNext = function(obj) {
try {
for (var i = 0; i < idxCnt; i++) {
vm.checkboxCollection[i] = obj[i];
}
}
catch (err) {
console.log(err);
}
// other code here
}
Я что-то упустил? Как мне это сделать?
Надеемся на ваши входы. Спасибо.
Нашел обходной путь после спотыкания по этому вопросу: Как снять отметку с переключателя, чтобы все объекты стали ложными. Поэтому я пересмотрел свой код следующим образом. Надеемся, это поможет другим, у кого будет такая же проблема:
Массив, содержащий вопросы:
{ inputType: "radio", name: 'qs1needs', question: "Tell us about your needs...",
choices: [
{ question: "I'm currently...", id: "qs1q1", selected:false },
{ question: "I'm currently...", id: "qs1q2", selected:false },
{ question: "I want to...", id: "qs1q3", selected:false },
{ question: "I want to...", id: "qs1q4", selected:false }
]}
HTML:
добавлены ng-change, value и ng-value
<input class="TWInputField" name="{{carousel.currentQuestionObject.name}}"
type="{{carousel.currentQuestionObject.inputType}}" id="{{query.id}}"
ng-model="query.selected"
ng-change="carousel.changeOnSelection(query.selected, query.id)"
value="" ng-value="true">
AngularJS:
// Check values of radio buttons on change
vm.changeOnSelection = function(selectedValue, selectedID) {
// item refers to each item inside choices
angular.forEach(vm.currentQuestionObject.choices, function(item) {
/* since answer is already bound to model,
if selected ID is not equal to ID in focus, change value to false.
*/
if (item.id !== selectedID) {
item.selected = false;
}
});
}