大佬教程收集整理的这篇文章主要介绍了angularjs-控制form及radio,checkbox,select,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
#ng-value可以填写表达式 <!DOCTYPEhtml> <html> <head> <Metacharset="UTF-8"> <title></title> <scripttype="text/javascript"src='js/angular.min.js'></script> <styletype="text/css"> .ng-cloak{display:none;} </style> </head> <bodyng-app="hd"ng-cloakclass="ng-cloak"> <divng-controller="ctrl"> 商品名称:<inputtype="text"ng-model="goods.name"/><br/> 商品价格:<inputtype="text"ng-model="goods.price"/><br/> 商品数量:<inputtype="text"ng-model="goods.num"/><br/> 商品总价:<inputtype='text'ng-value="goods.price*goods.num"readonly="readonly"/><br/> </div> <scripttype="text/javascript"> varm=angular.module('hd',[]) m.controller('ctrl',['$scope',function($scopE){ $scope.goods={'name':'iphone','price':3000,'num':0} }]) </script> </body> </html>
#ng-show关联单选框 <!DOCTYPEhtml> <html> <head> <Metacharset="UTF-8"> <title></title> <scripttype="text/javascript"src='js/angular.min.js'></script> <styletype="text/css"> .ng-cloak{display:none;} </style> </head> <bodyng-app="hd"ng-cloakclass="ng-cloak"> <divng-controller="ctrl"> 显示<inputtype="radio"ng-model="status"ng-value="1"/><br/> 关闭<inputtype="radio"ng-model="status"ng-value=""/><br/> {{status}} <textng-show="status==1">正在维护中...</text> </div> <scripttype="text/javascript"> varm=angular.module('hd',function($scopE){ $scope.status=1 }]) </script> </body> </html>
#复选框checkBox,控制选中的值:ng-true-value="1"ng-false-value="0" <!DOCTYPEhtml> <html> <head> <Metacharset="UTF-8"> <title></title> <scripttype="text/javascript"src='js/angular.min.js'></script> <styletype="text/css"> .ng-cloak{display:none;} </style> </head> <bodyng-app="hd"ng-cloakclass="ng-cloak"> <divng-controller="ctrl"> 游戏<inputtype="checkBox"ng-model="data.game"ng-true-value="1"ng-false-value="0"/><br/> 电影<inputtype="checkBox"ng-model="data.movie"ng-true-value="1"ng-false-value="0"/><br/> {{data.gamE}} <textareang-show="data.game==1">dota2</textarea> <textareang-show="data.movie">战狼2</textarea> </div> <scripttype="text/javascript"> varm=angular.module('hd',function($scopE){ $scope.data={'game':0,'movie':0} }]) </script> </body> </html>
#下拉列表SELEct,ng-options <!DOCTYPEhtml> <html> <head> <Metacharset="utf-8"/> <title></title> <scriptsrc="js/angular.min.js"></script> </head> <body> <divng-app="app"ng-controller="ctrl"> <SELEctng-options="v.valueasv.nameforvindata"ng-model="hobby"> <optionvalue="">请选择Hobby</option> </SELEct> {{hobby}} </div> <scripttype="text/javascript"> varm=angular.module('app',[]); m.controller('ctrl',function($scopE){ $scope.hobby='iphone' $scope.data=[ {name:'game',value:'dota2'},{name:'movie',value:'战狼2'},{name:'phone',value:'iphone'} ] }]); </script> </body> </html>
以上是大佬教程为你收集整理的angularjs-控制form及radio,checkbox,select全部内容,希望文章能够帮你解决angularjs-控制form及radio,checkbox,select所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。