JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app="app" ng-controller="controller">
    <a  ng-click="previous()">Previous</a>
    <a ng-click="next()">Next</a>
    
    <p>
        <input type="textarea" ng-model="text"> />
        <button ng-click="submit(text)">Submit</button>
    </p>
    
    <ng-include src="src"></ng-include>
    
    <script type="text/ng-template" id="1.html">
        <div><h1>One</h1>
            <div ng-repeat="item in items">{{item}}</div>
        </div>
    </script>  
    <script type="text/ng-template" id="2.html">
        <div><h1>Two</h1>
            <div ng-repeat="item in items">{{item}}</div>
        </div>
    </script> 
    <script type="text/ng-template" id="3.html">
        <div><h1>Three</h1>
            <div ng-repeat="item in items">{{item}}</div>
        </div>
    </script> 
    
</div>

JavaScript

angular.module('app',[]).controller('controller', function($scope){
    var change;
    
    change = function(){
        $scope.src = $scope.page + '.html';        
    };
    
    $scope.page = 1;
    $scope.items = [];
    
    change();
    
    $scope.submit = function(text){
        $scope.items.push(text);
    };
    $scope.next = function () {
        if($scope.page < 3){
            $scope.page++;
            change();
        }
    };
    
    $scope.previous = function () {
        if($scope.page > 1){
            $scope.page--;
            change();
        }
    };
    
});