JSFiddle - React, Tailwind, and code Playground

by dandoyon

HTML

<script src="http://code.angularjs.org/1.0.0/angular-1.0.0.min.js"></script>
<div ng-app='myApp'>
<div ng-controller="Ctrl">
   
    <input type='text' ng-model='value1'/> + 
    <input type='text' ng-model='value2'/>
    = <span>{{calculation()}}</span> or <span>{{calculationNoCast()}}</span>
    
</div>
</div>

CSS

.click2edit:hover{color:red;cursor:pointer;}

JavaScript

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

function Ctrl($scope){
  
    $scope.value1 = 10;
    $scope.value2 = 20;    
    $scope.calculation = function() {
        // input values are text
        return ($scope.value1 * 1) + ($scope.value2 * 1);  
        // return Number($scope.value1) + Number($scope.value2);         
    }
    $scope.calculationNoCast = function() {
        return $scope.value1 + $scope.value2;                  
    }         
    
}