在ng中的select的使用方法的讲解
来源:互联网 发布:lua java 编辑:程序博客网 时间:2024/05/23 15:54
项目中我们可能会使用到条件过滤选择框之类的东西,最简单的就是input、select、
关于select的使用我们通常会需要从数据库中返回数据进行动态绑定。
此时我们会有两种方式:
1)使用ng-repeat进行循环
<select class="textStyle my-input" ng-model="submitData.single_select[$index].befTil" name="title">
<option value="" selected="selected">{{tmp.default_name.keyname}}</option>
<option value="{{oname.v}}" ng-repeat="oname in opt track by $index">{{oname.keyname}}</option>
</select>
selected的作用就是是的页面显示初始值
另外我们的value不能赋值,否则会失效的!!!!
2)使用ng-option
1
2
3
4
<
select
, ng-model="htmlObj.partments" ng-change="setpartment(htmlObj.partments)"
ng-options="partments.id as partments.name for partments in partmentoption"
class="input_content" style="display: inline-block">
</
select
>
1
ng-change的作用就是每一次下拉框的选项值发生变化,就会触发这个很厉害的事件,这个事件的形参会自动的获得所取的值。<
br
>最终结果展示如下:
关于 ng-options="partments.id as partments.name for partments in partmentoption"这句话,我在此多讲一句。
partmentoption:就是一个数组对象,[{name:'名字',v:0,id:'44434343'},{name:'名字2',v:1,id:'32432323'},{name:'名字3',v:2,id:'543453343'},{name:'名字3',v:3,id:'434343434'}]
partments.name:就是下拉框的下拉选项的名字
partments.id:就是id、......partments.id as partments.name 的作用就是,每一次选择的name值发生改变,就会使得id值对应改变,并且ng-model的取值就是id值
阅读全文
0 0
- 在ng中的select的使用方法的讲解
- 讲解七种数据库中Select Top的使用方法
- 讲解七种数据库中Select Top的使用方法
- 讲解七种数据库中Select Top的使用方法
- mysql的select使用方法
- select的使用方法记录
- select 函数的使用方法
- ng-select 与 ng-options 的简单使用
- Angularjs中ng-select和ng-options的用法详解
- Select在Socket编程中的使用方法
- 很好的select count 讲解
- select * from 后有多个表的使用方法
- select * from 后有多个表的使用方法
- AngularJS 的select 控件的ng-options的使用示例
- ng-repeat中的ng-click事件的参数传递
- 如何在ng-if中取得ng-model的值
- ng-modle对select下拉选项的影响
- Angularjs中select 的ng-repeat 和 ng-options 用法和获取选取值
- jQuery图表插件 jqPlot实现饼状图
- SublimeText3 配置
- 离散对数和椭圆曲线加密原理
- wanchain有应用场景有哪些?有什么杀手级应用吗?
- 收藏好文
- 在ng中的select的使用方法的讲解
- Java中更精确的计时
- python-3
- USB学习之描述符篇,协议包,枚举过程,linux系列
- 测试程序
- Bower的入门
- iOS 使用CAShapeLayer给View添加虚线边框
- @Scheduled实现定时任务
- jquery选择器