Wie berechnet man AngularJS mit Prozentwert

Kannst du mir bei der Berechnung von AngularJS während der Datenbindung helfen? Es gibt noch ein weiteres Problem, da der Rabattwert nicht numerisch ist. Es ist eine Zeichenfolge mit '%' angehängt.Wie berechnet man AngularJS mit Prozentwert

Meine aktuelle Ausgabe:

Actual: 1000 
Discount: 10% 
Price after discount : 10%  [I want the calculation here. 1000-(.1*1000) ie 900] 

Actual: 600 
Discount: 5% 
Price after discount : 5% [I want the calculation here]

index.html

<body ng-app="myApp"> 
    <div ng-controller="ItemCtrl"> 
    <span ng-repeat="item in items"> 
    <div>Actual: {{item.actual}}</div> 
     <div>Discount: {{item.discount}}</div> 
     <div>Price after discount : {{item.discount}}</div> 
     <hr> 
     </span> 
    </div>

app.js

var myApp = angular.module('myApp', []); 

myApp.controller('ItemCtrl', ['$scope', function($scope) { 
    $scope.items = [{ 
    "discount": "10%", 
    "actual": "1000" 
    }, { 
    "discount": "5%", 
    "actual": "600" 
    }]; 
}]);

Hier ist meine jsfiddle Link: http://jsfiddle.net/960bhxab/1/

Quelle

2016-11-27 spiderman

Es ist besser, die Logik aus dem Dom zu halten.

http://jsfiddle.net/errvald/960bhxab/4/

var myApp = angular.module('myApp', []); 
 

 
myApp.controller('ItemCtrl', ['$scope', function($scope) { 
 
    $scope.items = [{ 
 
    "discount": "10%", 
 
    "actual": "1000" 
 
    }, { 
 
    "discount": "5%", 
 
    "actual": "600" 
 
    }]; 
 
    
 
    $scope.items.forEach(function(item){ 
 
    item['price'] = item.actual - (item.actual*item.discount.slice(0, -1))/100; 
 
    }); 
 
    
 
}]);

.rating { 
 
    color: #a9a9a9; 
 
    margin: 0; 
 
    padding: 0; 
 
} 
 

 
ul.rating { 
 
    display: inline-block; 
 
} 
 

 
.rating li { 
 
    list-style-type: none; 
 
    display: inline-block; 
 
    padding: 1px; 
 
    text-align: center; 
 
    font-weight: bold; 
 
    cursor: pointer; 
 
} 
 

 
.rating .filled { 
 
    color: red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.22/angular.min.js"></script> 
 
<body ng-app="myApp"> 
 
    <div ng-controller="ItemCtrl"> 
 
    <span ng-repeat="item in items"> 
 
    <div>Actual: {{item.actual}}</div> 
 
     <div>Discount: {{item.discount}}</div> 
 
     <div>Price after discount : {{item.price}}</div> 
 
     <hr> 
 
     </span> 
 
    </div> 
 
</body>

Quelle

2016-11-27 00:27:35 Erevald

Vielen Dank Erevald .. Viel sauberer Ansatz. Akzeptieren Sie dies für den zusätzlichen Aufwand, Code zu reinigen. Nur eine Korrektur wäre "item ['price'] = item.actual * (100-item.discount.slice (0, -1))/100;', so dass es für alle Datenszenarien wie [{actual: 1199, Rabatt: 33%}]. Ausgabe als 803.33 anstelle von 803.3299999999999 – spiderman

Eine Frage Wenn ich die '$ scope.items.forEach (Funktion (Element)' in meinem lokalen versuche, beschwert es sich mit einem Fehler 'TypeError: Kann die Eigenschaft' forEach 'von undefined nicht lesen um Neu (http: // localhost: 63342/coolapp/app.js: 8: 17) bei Object.invoke (https: // ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js:41:376) ' – spiderman

@spiderman sind die Artikel von einem Service kommen? Sie können die Schleifenlogik versuchen, bevor das Array zu einem Bereich hinzugefügt wird, und prüfen, ob 'Objekte' nicht 'undefiniert' sind. – Erevald

fand ich mich

Heres die JSFiddle. Bitte lassen Sie mich wissen, ob es einen besseren Ansatz gibt.

http://jsfiddle.net/960bhxab/2/

index.html:

<body ng-app="myApp"> 
    <div ng-controller="ItemCtrl"> 
    <span ng-repeat="item in items"> 
    <div>Actual: {{item.actual}}</div> 
     <div>Discount: {{item.discount}}</div> 
     <div>Price after discount : {{item.actual-(item.actual*item.discount.replace('%', '')/100)}}</div> 
     <hr> 
     </span> 
    </div> 
</body>

Quelle

2016-11-27 00:14:34 spiderman

Wenn Sie das% -Zeichen aus Ihren Daten entfernen, wird es die Mathematik ein bisschen leichter machen?

<div>Price after discount : {{item.actual - item.actual/100*item.discount}}</div>

Quelle

2016-11-27 00:17:12 MattJHoughton

Ziemlich ähnlich dem, was Sie auf dem Laufenden :) – MattJHoughton

Danke :) +1, aber unsere beiden Berechnungslogik ist bei der Anzeige von Preis nicht gut, was Mikkel geschrieben ist besser bei Tests mit Werten von {aktuell: 1199, Rabatt: 33}. wir beide bekommen einen Wert von '803.3299999999999', aber Mikkels Code gibt '803.33' zurück – spiderman

Es ist ziemlich einfach. Bewegen Sie das% aus den Variablen, so ist es nur für die Anzeige, dann ist die Berechnung einfach:

<div>Discount: {{item.discount}}%</div> 
    <div>Price after discount : {{item.actual*(100-item.discount)/100}}

http://jsfiddle.net/ao17ft09/

Quelle

2016-11-27 00:17:57 Mikkel

Danke Mikkel. Ihre Berechnungslogik ist besser als meine. In Bezug auf das "%" ist es Teil der JSON-Antwort. Ich ersetze jetzt mit 'ersetzen()' – spiderman

Wie berechnet man AngularJS mit Prozentwert

Antwort

Verwandte Themen