今天在学习AngularJs中使用ng-options指令创建下拉框时遇到点问题，这里总结一下。

　　其实，使用ng-options指令创建下拉框很简单，只需要绑定两个属性。

　　ng-options指令用于确定下拉列表元素的数组。

　　ng-model指令用于获取选定的值。

　　这里我直接贴上主要代码：

　　

　　这里刚开始我是不理解为什么要使用ng-model指令，而且该指令的值似乎是从天而降的，看起来像与其他的毫无关系，其实不然，ng-model指令在这里是用于获取下拉框选定的值。如果去掉ng-model的话，那么下拉框就会创建失败，而对于ng-model的值，可取任意值，当然必须是合法的字符串，否则下拉框创建了，但是无法获取到选定的值。

　　最后说一点，使用ng-options指令创建下拉框时，可以省略<option></option>

使用ng-options指令创建下拉框的更多相关文章

  1. AngularJS（二）——常见指令以及下拉框实现

    前言 学完AngularJS,总体上感觉没什么新鲜的东西,但是又感觉每一步都很新鲜,因为没有见过,又因为学到的语法函数和JavaScript差不多,本篇主要介绍一些AngularJS的指令,常见指令和 ...

  2. layui 根据根据后台数据动态创建下拉框并同时默认选中

        第一步 form表单里写好一个下拉框 <div class="layui-form-item"> <label class="layui-for ...

  3. crm使用soap创建下拉框

    //C#代码 //#region OptionMetadataCollection //OptionMetadataCollection opCollection = new OptionMetada ...

  4. javascript实例学习之一——联动下拉框

    经常碰到这样的需求,如省市_城市_乡镇下拉框.后一个下拉框的内容会根据前一个的改变而改变,之前的解决方法往往是在前一个改变的时候,向后台发送请求临时获取对应的内容.这样每触发一次就会网络请求一次,这种 ...

  5. jQuery无限级联下拉框插件

    自己编写jQuery插件 之 无限级联下拉框   因为是级联,所以数据必须是树型结构的,我这里的测试数据如下: 看下效果图: 1.>图一: 2.>图二: 3.>图三: 由图可知,下拉 ...

  6. java操作poi生成excel.xlsx（设置下拉框）下载本地和前端下载

    需求:导入excel表格,如果excel有错误,将错误的地方标红,在把数据以excel的形式写出,供用户下载解决方案:1.以实体类的方式接收excel并解析(创建两个集合一个接收正常的数据一个接收错误 ...

  7. vue自定义下拉框组件

    创建下拉框组件 Select.vue <template> <div class="selects"> <div :class="{sele ...

  8. 通过创建元素从而实现三个下拉框的联动效果(create.Element("option"))和提交表单时的验证p.match("请选择")

    <html> <head> <meta charset="utf-8"> <title>下拉框</title> < ...

  9. 自定义Angular指令与jQuery实现的Bootstrap风格数据双向绑定的单选&多选下拉框

    先说点闲话,熟悉Angular的猿们会喜欢这个插件的. 00.本末倒置 不得不承认我是一个喜欢本末倒置的人,学生时代就喜欢先把晚交的作业先做,留着马上就要交的作业不做,然后慢悠悠做完不重要的作业,卧槽 ...

随机推荐

  1. <!--[if lte IE 8][endif] ]-->IE下判断IE版本的语句

    <!--[if lte IE 6]> <![endif]--> IE6及其以下版本可见 <!--[if lte IE 7]> <![endif]--> ...

  2. scrapy框架第一章

    操作环境:python2.7+scrapy 安装比较简单,网上教程也超多,就不在此赘述. 示例网站:https://www.cnblogs.com/cate/python/ (爬去关于博客园所有pyt ...

  3. css3整理-方便查询使用

    最近详细地研究了CSS3的相关内容,并整理了这个文档,方便以后查询使用,分享给大家. 案例代码大家可以下载参考下:https://gitee.com/LIULIULIU8/CSS3 1.边框属性bor ...

  4. centos7 编译ntopng源码

    先安装编译所需的开发工具 yum groupinstall 'Development Tools' yum install tcl yum install libpcap libpcap-devel ...

  5. 一起学Linux04之Linux文件基本属性

    Linux系统是一种典型的多用户系统,不同的用户处于不同的地位,拥有不同的权限.为了保护系统的安全性,Linux系统对不同的用户访问同一文件(包括目录文件)的权限做了不同的规定. 为了介绍文件属性,首 ...

  6. spring的注解使用

    1.注解测试在xml里面配置<context:component-scan base-package="cn.ql"></component-scan>co ...

  7. Ruby学习之对象模型

    这两周工作内容较多,平时自己也有点不在状态,学的东西有点少了,趁着现在还有点状态,赶紧复习一下之前学习的Ruby吧. Ruby是我真正开始接触动态语言魅力的第一个语言,之前虽然也用过且一直用perl. ...

  8. 微信小程序入门

    自己看了一下微信小程序 其实  还是很简单的    官方有现成的api 跟 组件给你用   我的感觉就像是一个  前端框架  类似于  ionic 这种   感觉比ionic还要简单 里面的wxml  ...

  9. js 判断值为Array or Object的方法

    ①obj instanceof Array / Object ②Array.prototype.isPrototypeOf(obj) ③Object.prototype.toString.call(o ...

  10. 【Python3之正则re】

    一.正则re 1.正则表达式定义 正则就是用一些具有特殊含义的符号组合到一起(称为正则表达式)来描述字符或者字符串的方法.或者说:正则就是用来描述一类事物的规则.(在Python中)它内嵌在Pytho ...