Was ist los mit dieser einfachen Rechner App mit AngularJS?

<html ng-app="Myapp"> 
    <head> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
     <script src="app.js"></script> 
    <head> 
    <body> 
     <h1>Calculator App </h1> 
     <div ng-controller="myCtrl as ctrl"> 
      <input type="text" ng-model="ctrl.input1" ></input> 
      <span ng-bind="ctrl.selectedOperation"></span> 
      <input type="text" ng-model="ctrl.input2" ></input> 
      <button onclick="ctrl.compute()">=</button> 
      <span ng-bind="ctrl.resultValue"></span> 

      <p> 
       <button ng-click="ctrl.ButtonClicked('+')">+</button> 
       <button ng-click="ctrl.ButtonClicked('-')">-</button> 
       <button ng-click="ctrl.ButtonClicked('*')">*</button> 
       <button ng-click="ctrl.ButtonClicked('/')">/</button> 
      </p> 

     </div>  
    <body>    
</html>  

app.js:------ 

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

app.controller("myCtrl",myCtrl); 

function myCtrl(){ 
    this.resultValue = 0; 

    this.ButtonClicked = function(button){ 
    this.selectedOperation = button; 
    } 
    this.compute = function(){ 


     var number1 = parseFloat(this.input1); 
     var number2 = parseFloat(this.input2); 

     if(this.selectedOperation ==='+') 
     { 
      this.resultValue = number1 + number2; 

     }else if(this.selectedOperation ==='-') 
     { 
      this.resultValue = number1 - number2; 

     }else if(this.selectedOperation ==='*') 
     { 
      this.resultValue = number1 * number2; 

     }else if(this.selectedOperation ==='/') 
     { 
      this.resultValue = number1/number2; 
     } 

    } 
}

Ich bin ein Anfänger in Angular JS und ich lerne es von Java Brains Youtube-Kanal.Was ist los mit dieser einfachen Rechner App mit AngularJS?

app.js ist JavaScript-Datei, die mit HTML-Datei verknüpft ist, habe ich alles versucht, aber es funktioniert nicht.

Quelle

2016-12-21 Nikhil Bhosale

Wenn Sie sagen, nicht funktioniert, wie funktioniert es nicht? Welches Debugging hast du gemacht? – Draken

Hat eine Antwort Ihr Problem gelöst? – Mistalis

Diese HTML-Fragment:

<button onclick="ctrl.compute()">=</button>

sollte die ng-click Direktive anstelle der onclick Eigenschaft der Schaltfläche verwenden.

Quelle

2016-12-21 16:01:06 CraigR8806

Sie verwenden onclick auf Ihrer Schaltfläche statt ng-click.

So müssen Sie nur noch ändern:

<button onclick="ctrl.compute()">=</button>

An:

<button ng-click="ctrl.compute()">=</button>

JSFiddle demo.

Quelle

2016-12-21 16:00:43 Mistalis

Was ist los mit dieser einfachen Rechner App mit AngularJS?

Antwort

Verwandte Themen