Angularjs simple addition, subtraction, multiplication and division

Empire my love 2022-05-14 14:54:05 阅读数:871

angularjssimpleadditionsubtractionmultiplication

  The first method :

 <div ng-app="">
<div>
<!-- Text -->
<input type="number" ng-model="A" placeholder=" Input number 1">
{
{a}}
<input type="number" ng-model="B" placeholder=" Input number 2">
=
<!--// Four answers -->
<h2 id="a1" style="display:none" onclick="w1()">{
{A+B}}</h2>
<h2 id="a2" style="display:none" onclick="w2()">{
{A-B}}</h2>
<h2 id="a3" style="display:none" onclick="w3()">{
{A*B}}</h2>
<h2 id="a4" style="display:none" onclick="w4()">{
{A/B}}</h2>
</div>
<div>
<!--// Four buttons Add, subtract, multiply and divide Click which to display which -->
<button id="AA" ng-click="a='+'">+</button>
<button id="BB" ng-click="a='-'">-</button>
<button id="CC" ng-click="a='*'">*</button>
<button id="DD" ng-click="a='/'">/</button>
</div>
<script type="text/javascript">
// <!-- Click on the , Hide others -->
var AA = document.getElementById("AA");
var q = document.getElementById("a1");
var BB = document.getElementById("BB");
var w = document.getElementById("a2");
var CC = document.getElementById("CC");
var e = document.getElementById("a3");
var DD = document.getElementById("DD");
var r = document.getElementById("a4");
AA.onclick=function(){
q.style.display = "block";
w.style.display = "none";
e.style.display = "none";
r.style.display = "none";
}
BB.onclick=function(){
q.style.display = "none";
w.style.display = "block";
e.style.display = "none";
r.style.display = "none";
}
CC.onclick=function(){
q.style.display = "none";
w.style.display = "none";
e.style.display = "block";
r.style.display = "none";
}
DD.onclick=function(){
q.style.display = "none";
w.style.display = "none";
e.style.display = "none";
r.style.display = "block";
}
</script>
</div>

The second method :

 <div ng-app="" >
<div>
<button ng-click="a='+';C = A+B">+</button>
<button ng-click="a='-';C = A-B">-</button>
<button ng-click="a='*';C = A*B">*</button>
<button ng-click="a='/';C = A/B">/</button>
</div>
<div>
<input type="number" ng-model="A" placeholder=" Input number 1">
{
{a}}
<input type="number" ng-model="B" placeholder=" Input number 2">
=
<input type="number" value="{
{C}}" placeholder=" Input number 2">
</div>
</div>

 

版权声明:本文为[Empire my love]所创,转载请带上原文链接,感谢。 https://qdmana.com/2022/134/202205141446235602.html