Тренажёр для запоминания английских слов.
<!doctype html>
<html ng-app>
<head>
<script src="http://code.angularjs.org/1.1.5/angular.min.js"></script>
<script language="javascript" type="text/javascript">
function LangCntl($scope) {
// Данные для теста, вопрос, варианты и правильный ответ
var data=[
{
word:"for",
translate:["для","после","цикл","этот"],
realTranslate:"для"
},
{
word:"mix",
translate:["имельчить","смешать","взболтать","гоголь моголь"],
realTranslate:"смешать"
},
{
word:"angular",
translate:["яркий","пушистый","умный","гранёный"],
realTranslate:"гранёный"
}
];
// выставим первый вопрос
$scope.quest=data[0];
//счётчик
$scope.count=0;
//функция проверяющая ответы пользователя
$scope.respond=function(variant){
// проверим ответ
if(variant==$scope.quest.realTranslate) alert('Верно!');
else alert('увы, но правильный ответ '+$scope.quest.realTranslate);
//зададим следующий вопрос, но только если вопросы некончились
if($scope.count<data.length-1){
$scope.count++;
$scope.quest=data[$scope.count];
}
else{
alert("тестирование окончено");
}
}
}
</script>
</head>
<body>
<div ng-controller="LangCntl">
вопрос {{count+1}} ( кликайте по правильному ответу)<br/>
Как переводится <b>{{quest.word}}</b>
<hr/>
<ul>
<li ng-repeat="item in quest.translate | filter:query" ng-click="respond(item)">
{{item}}
</li>
</ul>
</div>
</body>
</html>