<div class="section-form" ng-repeat="headings in QuestionsMain">
<p>{{headings.Title}}</p>
<ul>
<li ng-repeat="section in headings.FormSection">
<h3>{{ section.Title }}</h3>
<ul>
<li ng-repeat="group in section.FormGroups">
<div>{{ group.Title }}</div>
<div class="" ng-repeat="questions in group.FormQuestions">
<h4>{{ questions.QuestionName }} </h4>
<ul >
<li ng-repeat="answers in questions.FormAnswers">
<input type="radio" name="content" value="{{ answers.AnswerCode }}" id="{{ answers.FormAnswer_ID }}" />
<label for="{{ answers.FormAnswer_ID }}" class="radio-style"></label>
</li>
</ul>
</div>
的Javascript
var eval = angular.module('evalQuestions', []);
//$scope.QuestionsMain contains json data
eval.controller('EvalController', ['$scope', 'questions', function ($scope, questions) {
questions.success(function (data) {
$scope.QuestionsMain = JSON.parse(data.d);
});
}]);
//calling webmethod for getting json data
eval.factory('questions', ['$http', function ($http) {
return ttp.post('EvaluationTest.aspx/GetEvaluationQuestionandAnswerDetails', { "evalNumber": 1, "languageCode": 'en' })
.success(function (data) {
return data;
})
.error(function (err) {
alert(err);
});
}]);
这是从我的webmethod
收到的json数据[
{
"Title":"Test Title 1",
"FormSection":[
{
"ContentType":"GENR",
"Title":"Test section 1",
"FormGroups":[
{
"Title":"Test Group 1",,
"FormQuestions":[
{
"QuestionName":"rate your course?",
"QuestionCode":"100",
"FormAnswers":[
{
"AnswerName":"Excellent",
"AnswerCode":"5"
},
{
"AnswerName":"Very good",
"AnswerCode":"4"
},
{
"AnswerName":"Good",
"AnswerCode":"3"
},
{
"AnswerName":"Fair",
"AnswerCode":"2"
},
{
"AnswerName":"Poor",
"AnswerCode":"1"
}
]
},
{
"QuestionName":"rate your food?",
"QuestionCode":"200",
"FormAnswers":[
{
"AnswerName":"Excellent",
"AnswerCode":"5"
},
{
"AnswerName":"Very good",
"AnswerCode":"4",
},
{
"AnswerName":"Good",
"AnswerCode":"3",
},
{
"AnswerName":"Fair",
"AnswerCode":"2",
},
{
"AnswerName":"Poor",
"AnswerCode":"1",
}
]
}
]
}
]
},
{
"ContentType":"GENR2",
"Title":"Test section 2",
"FormGroups":[
{
"Title":"Test Group 2",,
"FormQuestions":[
{
"QuestionName":"rate your teacher?",
"QuestionCode":"300",
"FormAnswers":[
{
"AnswerName":"Excellent",
"AnswerCode":"5"
},
{
"AnswerName":"Very good",
"AnswerCode":"4"
},
{
"AnswerName":"Good",
"AnswerCode":"3"
},
{
"AnswerName":"Fair",
"AnswerCode":"2"
},
{
"AnswerName":"Poor",
"AnswerCode":"1"
}
]
},
{
"QuestionName":"rate your course content?",
"QuestionCode":"400",
"FormAnswers":[
{
"AnswerName":"Excellent",
"AnswerCode":"5"
},
{
"AnswerName":"Very good",
"AnswerCode":"4",
},
{
"AnswerName":"Good",
"AnswerCode":"3",
},
{
"AnswerName":"Fair",
"AnswerCode":"2",
},
{
"AnswerName":"Poor",
"AnswerCode":"1",
}
]
}
]
}
]
}
]
}
]
我的asp.net页面如下所示
rate your teacher? 5 4 3 2 1 (these are radio buttons)
rate your class? 5 4 3 2 1 (these are radio buttons)
rate your food? 5 4 3 2 1 (these are radio buttons)
上面给出的HTML可能不合适但我认为你可以得到它的上下文。 我可以正确绑定数据。现在我想获取问号和选择的答案码,并在点击提交按钮时将其保存到数据库。
这里可以进行双向数据绑定吗?请告诉我一种或多种可能的方法。
答案 0 :(得分:0)
您的工厂不需要实现成功(如果您想这样做,您必须返回一个承诺(使用$ q服务))。在你的情况下,使用服务而不是工厂是最好的做法(服务是单身人士)。
eval.service('questions', ['$http', function ($http) {
var service;
service.getEval = $http.post('EvaluationTest.aspx/GetEvaluationQuestionandAnswerDetails', { "evalNumber": 1, "languageCode": 'en' });
}]);
return service;
然后,在您的控制器内,您可以实现承诺:
eval.controller('EvalController', ['$scope', 'questions', function ($scope, questions) {
questions.getEval().then(function (data) {
$scope.QuestionsMain = data;
}, function(error){
// Handle error here
});
$scope.save = function(){
// Call your question service here and save the object you will give him.
};
}]);
我认为你的观点是正确的(或差不多)。双向数据绑定将通过角度自动生成。
编辑:
从视图中调用保存功能,您只需添加指令ng-click
例如:
<input type="button" ng-click="save()" value="submit" />