JSFiddle - React, Tailwind, and code Playground

by patrickarlt

HTML

<link rel="stylesheet" href=" //cdnjs.cloudflare.com/ajax/libs/foundation/5.1.1/css/foundation.css">
<div ng-app>
    <div ng-controller="TodoCtrl">
        <form ng-submit="add()">
            <input type="text" placeholder="Add ToDo" ng-model="input" />
            <input class="button tiny" type="submit" value="Add" />
        </form>
        
        <h2>ToDos</h2>
        <ul>
            <li ng-repeat="todo in todos">{{todo.text}}</li>
        </ul>
    </div>
</div>

JavaScript

function TodoCtrl($scope){
    $scope.todos = [
        {text: "Give my angular talk"},
        {text: "Catch up on sleep"}        
    ]
    
    $scope.add = function(){
        if($scope.input.length){
            $scope.todos.push({text: $scope.input});
            $scope.input = ""
        }
    }   
}