angular使用下拉框+表单
在使用angular的过程中，遇到了很多需要操作下拉框的需求，特地总结一下
#
第一种查询页面
查询页面就是给一个下拉框，选项从数据库中来，每一次改变还可以联动使其他的下拉框跟着改变
<label class="col-sm-2 control-label">一级部门</label><div class="col-sm-2"><select ng-model="firstDept"ng-options="x as x.subCompanyNamefor x in firstDeptData"class="form-control"ng-change="changeLinkDept(firstDept.subCompanyId,3)"><option value="">请选择</option></select></div>
修改页面的会有一个默认值
当进入修改页面时候，下拉框会有一个默认值
chance1：x.id as x.name for x in users
chance2：x as x.name for x in users
ng-selected =”” 这一句就是 设置默认值
<label class="col-sm-2 control-label">是否半年考</label><div class="col-sm-2"><select class="form-control"ng-model="param.isSemiAnnualExam"ng-options="x.id as x.name for x in users"ng-selected="x.id==param.isSemiAnnualExam"><option value="">请选择</option></select></div>
表单的验证
表单的输入框能及时的提示是否合法
input 中 写的 name =“names” 是为了 后面的 form.names.dirty2.ng−pattern=””就是可以自己设置正则表达式3.dirty2.ng−pattern=””就是可以自己设置正则表达式3.error.pattern 就是angular自带的错误提示
禁用按钮
如果表单不合法是不能进行提交的
使用的是 ng-disable=”true 或者false”
<button type="submit"class="btn btn-default"ng-disabled='form.$invalid'ng-click="saveUpdateInfo()" >保存</button>
设置最大长度
给输入数据设置最大最小长度是很常见的
可以使用 ng-minlength=”” 或者 minlength=”“
<label class="col-sm-2 control-label">备注</label><div class="col-sm-8"><textarea class=" col-sm-6 form-control"ng-model="param.remark"maxlength="200" minlength="1"rows="5"></textarea></div>
修改页面的radio框
需要配合数据值确定选择默认值
<div class="checkbox"><label>指标规则是否可修改</label><label><input type="radio"ng-checked="judgevalue==true"ng-model="param.isModified"value='1'>是</label><label><input type="radio"ng-checked="judgevalue==false"ng-model="param.isModified"value='0'>否</label></div>
js代码
if($scope.param.isModified!=null&&$scope.param.isModified==1){$scope.judgevalue=true;}else{$scope.judgevalue=false;}
想要整理更多的碎片知识，扫码关注下面的公众号，让我们在哪里接着唠！
曾经终败给现在
今天药忘吃喽~
野性酷女
不念不忘少年蓝@
还没有评论，来说两句吧...