編集:コードを読みたくない人のために、私は基本的にフォームに node.selectedAnswer = "4,1,4" またはそのような文字列を含む「ノード」オブジェクトを渡しています。フォームにはラジオ ボタンがあり、そのうちの 1 つのボタンの値は「4,1,4」です。ラジオボタンにも ng-checked="node.selectedAnswer" 式があります。しかし、それはうまくいきません。node.selectedAnswer に適切な値があることは確かです。
ユーザーに尋ねる一連のラジオボタンの質問があります。前後に移動できるようにしてほしい。私はスタックを使用して、ajax 呼び出しから取得したデータと、オプションを選択して [次へ] をクリックしたときに selectedAnswer を格納しています。コード自体にコメントを付けて、できる限り状況を説明しました。{{node.selectedAnswer}}をページに適切に出力できても、ng-checkedがnode.selectedAnswerを取得していないことを除いて、すべてが機能しているようです。
<div class="container-fluid" ng-app="AccountRequest" ng-controller="GameNode" ng-init="outside={}">
<div class="row-fluid">
<div class="span2"></div>
<div class="span10">
<form>
<!-- node.selectedAnswer displays the selectedAnswer correctly when clicking previous and going back.
However, ng-checked is somehow not selecting the appropriate radio button. -->
<span>{{node.Question.Text}} selected answer: {{node.selectedAnswer}}</span>
<div class="radio" ng-repeat="answer in node.Answers">
<input type="radio" id="answerGroup" name="answerGroup" ng-checked="node.selectedAnswer" ng-model="outside.selectedAnswer"
value="{{answer.BranchId}},{{node.LeafId}},{{answer.Id}}"/> {{answer.Text}}
</div>
<div>
<input type="button" ng-click="previous()" value="Previous"/>
<input type="button" ng-click="next(outside.selectedAnswer)" value="Next"/>
</div>
</form>
</div>
</div>
</div>
//以下はスクリプトです
app.controller('GameNode', function ($scope, $http) {
var nodes = [];
function load(branchId, leafId, answerId) {
$http.get("/AccountRequest/GetNode?branchId=" + branchId +
"&leafId=" + leafId +
"&answerId=" + answerId)
.success(function (data) {
//get data and push it in the stack
nodes.push(data);
$scope.node = data;
});
}
function populateValues(selectedAnswer) {
var answer = null;
if (selectedAnswer === undefined || selectedAnswer == null)
selectedAnswer = "0,0,0";
//when next is clicked, retrieve the selectedAnswer from form and store it in current node as a property.
if (nodes.length > 0) {
var curNode = nodes.pop();
curNode.selectedAnswer = selectedAnswer;
nodes.push(curNode);
}
answer = selectedAnswer.split(',');
if (answer != null) {
load(answer[0], answer[1], answer[2]);
}
}
$scope.next = populateValues;
$scope.previous = function () {
//when previous is clicked, pop the current node out and throw it away.
//then pop the previous node out, read it, and push it back in as current node.
if (nodes.length > 1) {
nodes.pop();
var prevNode = nodes.pop();
nodes.push(prevNode);
$scope.node = prevNode;
}
};
populateValues();
});