i have list of questions , each question have set of options , want user selected answer each question in json in controller scope here ui code
<!doctype html> <html lang="en-us"> <script src="http://localhost:2088/mock/scripts/angular.min.js"></script> <script src="http://localhost:2088/mock/scripts/mocktestmodule.js"></script> <body> <div ng-app="mocktestapp" ng-controller="questionctrl"> <li ng-repeat="question in questions"> <p>{{question._question }}</p> <ul ng-repeat="option in question.options"> <li ng-repeat="(key, value) in option"><input type="radio" name="option" value="{{key}}" /> {{value}}</li> </ul> </li> <button value="next>" ng-click="next()">next</button> </div> </body> </html> and angular code
var app = angular.module('mocktestapp', []); app.controller('questionctrl',['$scope','questionfactory', function($scope,questionfactory) { questionfactory.get(function(data){ $scope.questions=[{ "_question" :"question 1", "options":[{ "1":"11qwert", "2":"22qwert", "3":"11qwert", "4":"22qwert" }] },{ "_question" :"question 2", "options":[{ "1":"abcd", "2":"efgh", "3":"hijk", "4":"lmno" }] }]; }); $scope.next=function() { questionfactory.next(function(data){ $scope.questions=data; }); } }]); app.factory("questionfactory", function ($http) { var geturl="http://localhost:2088/test"; var nexturl="http://localhost:2088/test/next"; return { get: function (callback) { $http.get(geturl) .success(function (response, status) { callback(response) } ) .error(function (data, status, headers, config) { callback(data); }); }, next: function (callback) { $http.get(nexturl) .success(function (response, status) { callback(response) } ) .error(function (data, status, headers, config) { callback(data); }); } }; }); now want bind questions json radio buttons generated ng-repeat directive
you need set ng-model directive on inputs:
<input type="radio" ng-model="user.answer" name="option" value="{{key}}" /> when input checked user.answer === {{key}}
Comments
Post a Comment