Pass model variable from controller to html using AngularJS -
i new angularjs. in example trying read 2 initiger value controller model , multiple numbers in html page using angularjs tag.
controller
(function (angular) { angular.module('invoice1', []) .controller('invoicecontroller', function () { this.qty = 1; this.cost = 2; }); }) html
<!doctype html> <html ng-app> <head> <title>angularjs form test 2</title> <link href="content/bootstrap.min.css" rel="stylesheet" /> <script src="scripts/angular.min.js"></script> <script src="invcontroller.js"></script> </head> <body> <div id="calculatenumber" ng-app="invoice1" ng-controller="invoicecontroller invoice"> <div> quantity : <input type="number" min="0" ng-model="invoice.qty" /> </div> <div> costs : <input type="number" min="0" ng-model="invoice.cost" /> </div> <div> <b>total: </b> {{invoice.qty * invoice.cost | currency}} </div> </div> </body> </html>
you have mentioned multiple ng-app in html.
use ng-app="invoice1" in <html> tag, remove other 1 , go
<!doctype html> <html ng-app="invoice1"> <head> <title>angularjs form test 2</title> <link href="content/bootstrap.min.css" rel="stylesheet" /> <script src="scripts/angular.min.js"></script> <script src="invcontroller.js"></script> </head> <body> <div id="calculatenumber" ng-controller="invoicecontroller invoice"> <div> quantity : <input type="number" min="0" ng-model="invoice.qty" /> </div> <div> costs : <input type="number" min="0" ng-model="invoice.cost" /> </div> <div> <b>total: </b> {{invoice.qty * invoice.cost | currency}} </div> </div> </body> </html> here's updated plunkr
Comments
Post a Comment