標籤：angularjs
#ng-value可以填寫運算式<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src=‘js/angular.min.js‘> </script> <style type="text/css"> .ng-cloak{display:none;} </style> </head> <body ng-app="hd" ng-cloak class="ng-cloak"> <div ng-controller="ctrl"> 商品名稱：<input type="text" ng-model="goods.name" /><br /> 商品價格：<input type="text" ng-model="goods.price" /><br /> 商品數量：<input type="text" ng-model="goods.num" /><br /> 商品總價：<input type=‘text‘ ng-value="goods.price*goods.num" readonly="readonly"/><br /> </div> <script type="text/javascript"> var m=angular.module(‘hd‘,[]) m.controller(‘ctrl‘,[‘$scope‘,function($scope){ $scope.goods={‘name‘:‘iphone‘,‘price‘:3000,‘num‘:0} }]) </script> </body></html>
#ng-show關聯單選框<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src=‘js/angular.min.js‘> </script> <style type="text/css"> .ng-cloak{display:none;} </style> </head> <body ng-app="hd" ng-cloak class="ng-cloak"> <div ng-controller="ctrl"> 顯示 <input type="radio" ng-model="status" ng-value="1" /><br /> 關閉 <input type="radio" ng-model="status" ng-value=""/><br /> {{status}} <text ng-show="status==1">正在維護中...</text> </div> <script type="text/javascript"> var m=angular.module(‘hd‘,[]) m.controller(‘ctrl‘,[‘$scope‘,function($scope){ $scope.status=1 }]) </script> </body></html>
#複選框checkbox, 控制選中的值：ng-true-value="1" ng-false-value="0"<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src=‘js/angular.min.js‘> </script> <style type="text/css"> .ng-cloak{display:none;} </style> </head> <body ng-app="hd" ng-cloak class="ng-cloak"> <div ng-controller="ctrl"> 遊戲 <input type="checkbox" ng-model="data.game" ng-true-value="1" ng-false-value="0" /><br /> 電影 <input type="checkbox" ng-model="data.movie" ng-true-value="1" ng-false-value="0" /><br /> {{data.game}} <textarea ng-show="data.game==1">dota2</textarea> <textarea ng-show="data.movie">戰狼2</textarea> </div> <script type="text/javascript"> var m=angular.module(‘hd‘,[]) m.controller(‘ctrl‘,[‘$scope‘,function($scope){ $scope.data={‘game‘:0,‘movie‘:0} }]) </script> </body></html>
angularjs-控制form及radio,checkbox,
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
