您的位置:首页技术文章
文章详情页

angular.js - 怎么用Angularjs 来实现如图

【字号: 日期:2024-10-13 18:48:21浏览:23作者:猪猪

问题描述

angular.js - 怎么用Angularjs 来实现如图

每一行作为一个订单商品详情选择商品填充商品名称,价格数量默认为1,价格和数量可以手动修改,总价不能修改 总价=数量*单价;

怎么绑定这个每一行的model啊

问题解答

回答1:

写了一个sample做参考:

<body ng-app='orderSum'> <table ng-controller='orderController'><thead> <tr><th>序号</th><th>数量</th><th>单价</th><th>总价</th> </tr></thead><tbody ng-repeat='order in orders track by $index'> <tr><td>{{ $index+1 }}</td><td><input ng-model='order.count'></td><td><input ng-model='order.price'></td><td><input readonly='true' value='{{ order.count * order.price }}'></td> </tr></tbody> </table> <script> var myApp = angular.module('orderSum',[]); myApp.controller('orderController',[’$scope’,function($scope){$scope.orders=[];$scope.orders.length=10; }]); </script></body>回答2:

ng-repeat + array.push({id:1,name:’’,price:0,num:0})

ng-repeat=’x in array’

ng-model=’x.num’

ng-model=’x.price’

ng-bind=’x.num * x.price’

回答3:

ngRepeat

相关文章: