Partage
  • Partager sur Facebook
  • Partager sur Twitter

AngularJS : Calculatrice

Ji du 73
    22 février 2018 à 22:57:22

    Bonjour,

    Je suis entrain de programmer une petite calculatrice en html/javascript. Malgré mes efforts acharné cette dernière refuse de calculer.

    Quelqu'un peut-il m'indiquer d'où vient le dysfonctionnement.

    Voici le code html :

    <!doctype html>
<html class="no-js" lang="">
<head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title>MIAGE Calculator</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">


    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="css/bootstrap.min.css">




</head>
<body>
<div class="pos-f-t">
    <div class="collapse" id="navbarToggleExternalContent">
        <div class="bg-dark p-4">
            <h4 class="text-white">Te</h4>
            <span class="text-muted">est</span>
        </div>
    </div>
    <nav class="navbar navbar-light bg-light">
        <a class="navbar-brand" href="#">Calculator</a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarToggleExternalContent">
            <span class="navbar-toggler-icon"></span>
        </button>
    </nav>

    <div ng-controller="myCtrl">
    <div class="container">
        <div class="col-sm-12 col-lg-12 ">
            <form action="">
                <div class="form-group">
                    <label>Op. 1</label>
                    <input type="number" id="op1" class="form-control"/>
                    <label>Op. 2</label>
                    <input type="number" id="op2" class="form-control"/>
                    <label>Résultat</label>
                    <input type="number" id="resultat" readonly class="form-control"/>
                    <br>
                    <div class="row">
                        <div class="col-sm-6">
                            <button type="button" class="form-control btn-primary" id="plus" ng-click="additioner()">+</button>
                            <br>
                            <button type="button" class="form-control btn-primary" id="moins ng-click="soustraire()">-</button>
                            <br>
                        </div>
                        <div class="col-sm-6">
                            <button type="button" class="form-control btn-primary" id="multi" ng-click="multiplier()">*</button>
                            <br>
                            <button type="button" class="form-control btn-primary" id="divi" ng-click="diviser()">/</button>
                        </div>
                    </div>
                    <br>
                    <button type="button" class="form-control btn-success">Mémoriser</button>
                    <br>
                    <button type="button" class="form-control btn-success">Charger la mémoire</button>

                    <label>En mémoire</label>
                    <input type="number" id="memoire" readonly class="form-control"/>
                </div>
        </div>
        </form>
    </div>
    </div>

    <script type="text/javascript" src="js/jquery-3.3.1.js"></script>
    <script type="text/javascript" src="js/popper.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>
    <script type="text/javascript" src="js/angular.js"></script>
</body>
</html>

    et puis voici mon JS :

    var app = angular.module("monApp",[]);

app.controller("myCtrl", function ($scope){
    $scope.resultat = 0;
    $scope.op1 = 'op1';
    $scope.op2 = 'op2';

    $scope.additioner = function () {
        $scope.resultat = $scope.op1 + $scope.op2;
    };

    $scope.sousraire = function () {
        $scope.resultat = $scope.op1 - $scope.op2;
    };

    $scope.multiplier = function () {
        $scope.resultat = $scope.op1 * $scope.op2;
    };

    $scope.diviser = function () {
        $scope.resultat = $scope.op1 / $scope.op2;
    };

});





    • Partager sur Facebook
    • Partager sur Twitter
    Ji du 73

    AngularJS : Calculatrice

    × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
    × Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
    • Editeur ●
    • Markdown