Java, .NET, PHP, PYTHON, ANGULAR, .NET, ML, Data Scince, Testing, CI Tutorials in Easy Languages.

"Best Software Training, Internship, Project Development center of Indore India, Helpline 780506-3968"

 Create a Simple Interest program in Angular JS:-


step 1st:-     Create HTML Form and add angular library

Step2nd:-   add ng-app and ng-controller under body section or <div>


step3rd:-     add angular event under button tag ng-click


step4th:-      define controller script using javascript

                  add module using ng-app attribute

                   var app = angular.modules('appname',[]);    [] means angular route ,default is null

                   app.controller('controllername',function($scope){



                  });

   $scope is the global variable in angular js which can bind ng-model data under the controller block.

  it provides two-way data-binding from the controller to view and view to the controller.


Complete Solution of SI program?

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"> </script>
</head>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<input type="text" ng-model="p" />
<br>
<br>
<input type="text" ng-model="r" />
<br>
<br>
<input type="text" ng-model="t" />
<br>
<br>
<input type="button" value="calculate" ng-click="fun()">
<br>
{{res}}


</div>   


<script type="text/javascript">
   
var app = angular.module('myApp',[]);
app.controller("myCtrl",function($scope)
   {
        $scope.p=0;
        $scope.r=0;
        $scope.t=0;
        $scope.fun=function(){
         $scope.res = (eval($scope.p)*eval($scope.r)*eval($scope.t))/100;

        }

   })

</script>

</body>
</html>




Post a Comment

If you have any doubt in programming or join online classes then you can contact us by comment .

Previous Post Next Post