JSFiddle - React, Tailwind, and code Playground

by armyofda12mnkeys

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.14/angular-ui-router.js"></script>
<div ng-app="myApp">
    
    <div ui-view="main">Loading questions...</div>
    
</div>

JavaScript

var myApp = angular.module('myApp',['ui.router']);
myApp.config(function ($urlRouterProvider, $stateProvider){
    $urlRouterProvider.otherwise('/');
    $stateProvider
    .state('app', {
        url: '/',
        views: {   
            'main': {
                controller: 'MyCtrlInit'
            }
         }
     })
    .state('question', {
      url: '/question/{id}',
      views: {
          'main': {
              template: '<button type="button" ng-click="getprevquestion()">Previous Question</button><button type="button" ng-click="getnextquestion()">Next Question</button><question currentquestion="currentquestion" getnextquestion="getnextquestion()" />',
              controller: 'MyCtrl'
          }
      }
    });
});


myApp.controller("MyCtrlInit", function ($scope, $state) {
    console.log('init');
    $state.go('question', {
        id: 'QS1'
    });
});
myApp.controller("MyCtrl", function ($scope, $state, $stateParams) {
    $scope.questions = [
        {
         qid: 'QS1', 
         text: 'What is your GPA?'
        },
        {
         qid: 'QS2', 
         text: 'What is your SAT scores?'
        },
        {
         qid: 'QS3', 
         text: 'What are your GMAT scores?'
        },
        {
         qid: 'QS_SEARCH', 
         text: 'One sec, searching for a matching college...'
        },
        {
         qid: 'QS_SUCCESS', 
         text: 'Found a match!'
        }
        
    ];
    
    //get index and currentquestion based on param in route
    var current_question_url = $stateParams.id;
    for(var i=0; i < $scope.questions.length; i++) {
        var question = $scope.questions[i];
        
        console.log( question.qid +'=='+ current_question_url );
        if( question.qid==current_question_url) {
            $scope.current_question_index = i;    
            $scope.currentquestion = question;    
            break;
        }
    }

    
    
    //$scope.currentquestion = $scope.questions[ $scope.current_question_index...