Untitled

<html ng-app="mathApp">
    <head>
        <title>AngularJS Math Operations</title>
        <script src="angularjs.js"></script>
    </head>
    <style>
        body,button{
            text-align:center;
            color:white;
            background-size: auto;
            background-color: black;   
        }  
    </style>
<body ng-controller="mathController">
    <h2>Factorial and square of a number</h2>
    Enter a Number:
    <br>
    <input type="number" ng-model="inputNumber">
    <br>
    <br>
    <br>
    <button ng-click="calculateFactorial()">Calculate Factorial</button>
    <button ng-click="calculateSquare()">Calculate Square</button>
    <p ng-show="factorialResult !== undefined">Factorial: {{ factorialResult }}</p>
    <p ng-show="squareResult !== undefined">Square: {{ squareResult }}</p>
    <script>
        angular.module('mathApp', []).controller('mathController',function($scope){
            $scope.calculateFactorial = function () {
                if ($scope.inputNumber >= 0) {
                    $scope.factorialResult = factorial($scope.inputNumber);
                } 
                else {
                    $scope.factorialResult = 'Cannot calculate factorial';
                }
            };
            $scope.calculateSquare = function () {
                $scope.squareResult = $scope.inputNumber * $scope.inputNumber;
            };
            factorial=function(n){
                if (n == 0 || n == 1) {
                    return 1;
                } 
                else {
                    return n * factorial(n - 1);
                }
            }
        });
    </script>
    </body>
</html>
Editor is loading...