JSFiddle - React, Tailwind, and code Playground

by tcallaghan2001

HTML

<div data-ng-app>
	<div data-ng-controller="TestCtrl">
		<div style="background-color: yellow" data-ng-show="testShow()">
			This is the div to be shown/hidden
		</div>
		<div>
			<button type="button" data-ng-click="changeVariable1()">Change Variable 1</button>
			Variable 1: {{variable1}}
		</div>
		<div>
			<input type="text" data-ng-model="variable2" />
			Variable 2: {{variable2}}
		</div>
	</div>
</div>

JavaScript

function TestCtrl($scope) {
	debugger;
	$scope.variable1 = false;
	$scope.variable2 = '';

	$scope.testShow = function() {
		return $scope.variable1 && $scope.variable2 !== '';
	};

	$scope.changeVariable1 = function() {
		$scope.variable1 = $scope.variable1 === false;
	};
}