JSFiddle - React, Tailwind, and code Playground

by jayrmotta

HTML

<div ng-app="twoWayTest">
    <div ng-controller="TestCtrl">
        <span>Hi {{firstName}} {{lastName}}! How are you?</span>
        <br/>
        <select ng-model="mood">
            <option>Sad</option>
            <option>Ok</option>
            <option>Good</option>
            <option>Great</option>
        </select>
        <br/>
        <button ng-click="askWhy()">Why?</button>
        <br/><br/>
        <div ng-if="showJoke">
            <p>
                Knock, knock
                Who’s there?
                Merry.
                Merry who?
                Merry Christmas!
            </p>
        </div>
        <div ng-if="!showJoke">
            <p>
                Just to know :)
            </p>
        </div>
    </div>
</div>

JavaScript

var app = angular.module('twoWayTest', []);

app.controller('TestCtrl', function($scope) {
    $scope.firstName = 'John';
    $scope.lastName = 'Doe';
    
    $scope.askWhy = function() {
        $scope.showJoke = $scope.mood === 'Sad';
    };
});