在ng中的select的使用方法的讲解
项目中我们可能会使用到条件过滤选择框之类的东西,最简单的就是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
<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>
ng-change的作用就是每一次下拉框的选项值发生变化,就会触发这个很厉害的事件,这个事件的形参会自动的获得所取的值。
最终结果展示如下:

关于 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值
参考链接:http://www.cnblogs.com/wolf-sun/p/4614532.html
在ng中的select的使用方法的讲解的更多相关文章
- WPF InkCanvas EditingMode为Select时 在其选择时各种事件中撤销Select模式的方法
InkCanvas有多种输入模式. 通过InkCanvasEditingMode来进行对其调整 分别是 None=0// 忽略鼠标和手写笔输入 Ink = 1// 允许用户绘制批注,默认模式.使用鼠标 ...
- Ruby中区分运行来源的方法(转)
Ruby中区分运行来源的方法 这篇文章主要介绍了Ruby中区分运行来源的方法,本文讲解的是类似Python中的if name == 'main':效果,其实Ruby中也有类似语法,需要的朋友可以参考下 ...
- [转]Shell脚本中获取SELECT结果值的方法
http://blog.itpub.net/13885898/viewspace-1670297/ 有时候我们可能会需要在Shell脚本中执行SELECT语句,并将结果赋值给一个变量,对于这样的情形, ...
- sql判断以逗号分隔的字符串中是否包含某个字符串--------MYSQL中利用select查询某字段中包含以逗号分隔的字符串的记录方法
sql判断以逗号分隔的字符串中是否包含某个字符串---------------https://blog.csdn.net/wttykj/article/details/78520933 MYSQL中利 ...
- “取出数据表中第10条到第20条记录”的sql语句+select top 使用方法
1.首先.select top使用方法: 參考问题 select top n * from和select * from的差别 select * from table -- 取全部数据.返回无序集合 ...
- 在ORACLE中实现SELECT TOP N的方法----[转]
1.在ORACLE中实现SELECT TOP N 由于ORACLE不支持SELECT TOP语句,所以在ORACLE中经常是用ORDER BY跟ROWNUM的组合来实现SELECT TOP N的查询. ...
- 在dialog的content中嵌入select的获取选中值方法
var shortNameList = "<select><option value='1'>1</option><option value='2' ...
- ORA-01652:无法通过128(在表空间temp中)扩展temp段 解决方法
ORA-01652:无法通过128(在表空间temp中)扩展temp段 解决方法 (2016-10-21 16:49:53) 今天在做一个查询的时候,报了一个"ORA-01652无法通过 ...
- 清空SQL Server数据库中所有表数据的方法(转)
清空SQL Server数据库中所有表数据的方法 其实删除数据库中数据的方法并不复杂,为什么我还要多此一举呢,一是我这里介绍的是删除数据库的所有数据,因为数据之间可能形成相互约束关系,删除操作可能陷入 ...
随机推荐
- 新添加的DOM节点如何实现动画效果
如何给新添加的DOM节点加动画效果 最近碰到项目中,在DOM节点中,添加新的 html 后 要有动画效果,一直没能很好地理解,尝试了各种方式,终于找出来了 简化版结构 代码如下 使用jq1.9以上版本 ...
- Django开发BUG "Model class WH_auth.models.User doesn't declare an explicit app_label and isn't in an application in INSTALLED_APPS."
当进行数据库迁移的时候发生问题,报错如下:RuntimeError: Model class WH_auth.models.User doesn't declare an explicit app_l ...
- L161
The robot arm made for gentle undersea explorationA soft robotic arm which will allow underwater sea ...
- Corosync+pacemaker实现集群的高可用
一.Corosync和pacemaker的了解: Corosync是集群管理套件的一部分,他在传递信息的时候可以通过一个简单的配置文件来定义信息传递的方式和协议等.也就是说,corosync是Mess ...
- if条件判断
if 条件判断的是布尔值,常用的有以下几种 1.in 在不在它里面,返回的是布尔值 names='zhangsan lisi xiaoming' print("zhangsan" ...
- 01-名字管理系统.py
#-*- coding:utf-8 -*- #1.打印功能提示 print("-"*50) print("名字管理系统 V8.6") print("1 ...
- keras channels_last、preprocess_input、全连接层Dense、SGD优化器、模型及编译
channels_last 和 channels_first keras中 channels_last 和 channels_first 用来设定数据的维度顺序(image_data_format). ...
- MpVue开发之组件引入的问题
再一次开发订餐系统中,遇到订餐页面引入头部商品列表,底部组件时,报错,模块编译失败,未进入缓存区. 我以为是新添加的模块没有重新启动导致的,然后重新与运行npm run dev后还是失败, 最后经过反 ...
- 【剑指offer】10A--求裴波那切数列的第n项,C++实现
#本文是牛客网<剑指offer>刷题笔记 1.题目 写入一个函数,输入n,输出裴波那切数列的第n项 2.思路 递归--时间和空间复杂度高 循环--时间和空间复杂度低,通过循环迭代计算第n项 ...
- [转载][QT][SQL]sql学习记录7_sqlite 日期 & 时间
转载自:定义及示例请见 : http://www.runoob.com/sqlite/sqlite-date-time.html SQLite 日期 & 时间 SQLite 支持以下五个日期和 ...