angular.js - 怎么用Angularjs 來(lái)實(shí)現(xiàn)如圖
問(wèn)題描述
每一行作為一個(gè)訂單商品詳情選擇商品填充商品名稱,價(jià)格數(shù)量默認(rèn)為1,價(jià)格和數(shù)量可以手動(dòng)修改,總價(jià)不能修改 總價(jià)=數(shù)量*單價(jià);
怎么綁定這個(gè)每一行的model啊
問(wèn)題解答
回答1:寫了一個(gè)sample做參考:
<body ng-app='orderSum'> <table ng-controller='orderController'><thead> <tr><th>序號(hào)</th><th>數(shù)量</th><th>單價(jià)</th><th>總價(jià)</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
相關(guān)文章:
1. javascript - 能否讓vue-cli的express修改express重啟服務(wù)2. 解決Android webview設(shè)置cookie和cookie丟失的問(wèn)題3. javascript - gulp打包引入文件路徑在生產(chǎn)環(huán)境和開發(fā)環(huán)境下的切換4. node.js - npm一直提示proxy有問(wèn)題5. python - 我想把下面代碼中的多余空白行去除該怎么做,如何用正則實(shí)現(xiàn)6. PHP單例模式7. 最新版本的微信web開發(fā)者工具必須要APPID,會(huì)提供測(cè)試號(hào),但是像你一樣tabBar配置的話不會(huì)顯示首頁(yè)與日志,難道我要下載跟你一樣的版本?8. 網(wǎng)頁(yè)爬蟲 - python爬蟲翻頁(yè)問(wèn)題,請(qǐng)問(wèn)各位大神我這段代碼怎樣翻頁(yè),還有價(jià)格要登陸后才能看到,應(yīng)該怎么解決9. python - tweepy 庫(kù) 連接Twitter API 報(bào)錯(cuò)10. python - 網(wǎng)頁(yè)title中包含換行,如何用正則表達(dá)式提取出來(lái)?
