https://cnodejs.org/topic/549007b44823a0234c9e1716 


myAppModule.controller('FrmController', ['$scope',function($scope){

 $scope.colors = [{name:'black', shade:'dark'},{name:'white', shade:'light'},{name:'red', shade:'dark'},{name:'blue', shade:'dark'},{name:'yellow', shade:'light'}];

 $scope.myColor = 'red';}]);
<form ng-controller="FrmController">

<select ng-model="m.myColor" ng-options="color.name as color.name for color in colors">

</select>

</form>

----------------------------
$scope.m = $scope.colors[0];

<select ng-model="m" ng-options="***color ***as color.name for color in colors">
这样居然可以一次获取到 color 对象的全部属性值；


<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>test</title>
<script type="text/javascript" src="angular.min.js"></script>
<script>
var myApp = angular.module("myApp", []);
myApp.controller("testCtrl", function($scope){
    $scope.data = [{id:1,value:'hello'},{id:2,value:'bye'},{id:3,value:'hmmmm'}];
    //$scope.selectValue = $scope.data[0].id;
});
</script>
</head>
 
<body ng-app="myApp">
<form ng-controller="testCtrl">
  <select ng-model="selectValue" ng-options="item.id as item.value for item in data"></select><br /><br />
  <div ng-switch="selectValue">
    <div ng-switch-when="1">hello</div>
    <div ng-switch-when="2">bye</div>
    <div ng-switch-when="3">hmmmm</div>
    <div ng-switch-default>ah?</div>
  </div>
</form>
</body>
</html>
也可以不用switch用ng-show/hide或者ng-if这样的。

angularjs的select使用2的更多相关文章

  1. AngularJS下拉列表select在option动态变化之后多出了一个错误项的问题

    场景: Select初始化之后,选中select的某个选项 通过AngularJS更新select的选项 错误写法: HTML(使用ng-repeat) <div ng-app="Te ...

  2. AngularJS的select设置默认值

    AngularJS的select设置默认值 在使用Angular时候使用select标签时会遇到绑定数据指定默认显示值可这样实现 <!DOCTYPE html> <html ng-a ...

  3. 关于angularjs的select下拉列表存在空白的解决办法

    angularjs 的select的option是通过循环造成的,循环的方式可能有ng-option或者</option  ng-repeat></option>option中 ...

  4. AngularJS初始化Select选择框

    一.引入 之前一个离职的同事负责的项目大量的引入了AngularJS的JS框架,后来我接手相关他项目里的功能.由于对AngularJS不是太熟,在他的功能上进行二次开发就比较费劲了,印象比较深的一个就 ...

  5. Angularjs实现select的下拉列表

    练习使用angularjs实现一个select下拉列表: <div ng-app="selectApp" ng-controller="selectControll ...

  6. AngularJS：Select

    ylbtech-AngularJS:Select 1.返回顶部 1. AngularJS Select(选择框) AngularJS 可以使用数组或对象创建一个下拉列表选项. 使用 ng-option ...

  7. angularjs 下select中ng-options使用

    当我有一堆object数据要用下拉框进行显示选择时,可以使用到angularjs中的select中的ng-options的属性.官网网址:https://docs.angularjs.org/api/ ...

  8. AngularJs的Select演示

    昨天需要在项目使用Angular.js的select,测试了好久才研究出怎么进行赋值,操作. HTML代码 <!DOCTYPE html> <html> <head> ...

  9. angularJs绑定select的正确姿势

    最近在项目中使用ionic,需要在页面上绑定一个年份下拉框,默认选中当前年,并且在下拉框的change事件中增加一些业务逻辑. 不管是使用ng-repeat还是ng-options,都是各种坑:默认选 ...

  10. angularJS中select元素的应用浅析

    select array 数据: select ng-model 用法: 1.可以是一个对象形式,ng-model="test" $scope.test = {name: &quo ...

随机推荐

  1. 十、future其他成员函数、shared_future、atomic（原子操作）

    一. int mythread(){ cout<<"thread"<<endl; std::chrono::milliseconds dura();//5秒 ...

  2. txt操作

    C#解决读写包含汉字的txt文件时乱码的问题 C#解决读写包含汉字的txt文件时乱码的问题 当我们用System.IO.StreamReader读取包含汉字的txt文件时,经常会读出乱码(Stream ...

  3. Hive date_trunc函数

    The function date_trunc is conceptually similar to the trunc function for numbers. date_trunc('field ...

  4. php读取excel(支持03，07)

    需要用到PHPExcel这个类 附上代码 //phpExcel读取excel内容 header("Content-Type:textml;charset=utf-8"); //引用 ...

  5. js不同类型作比较

    引用自 http://www.zhufengpeixun.cn/jishuziliao/javaScriptzhuanti/2014-06-14/300.html 不同类型间的比较,规律如下 类型 类 ...

  6. Java学习之多态---类成员变化

    类成员 一.成员变量 编译时:变量(f)所属类(Fu)中是否有成员变量,有:编译成功,没有:编译失败 运行时:变量(f)所属类(Fu)中是否有成员变量,运行该类(Fu)中的成员变量 class Fu ...

  7. Linux（Ubuntu）常用命令（四）

    权限修改: 先知: u user 表示该文件的所有者 g group 表示与该文件的所有者属于同一组( group )者,即用户组 o other 表示其他以外的人 a all 表示这三者皆是 r r ...

  8. 私有IP地址

    私有IP地址: 在ABC三类网络中,如下三段网络地址为私有IP地址,如何人都可以自行在自己的局域网中使用这些IP地址. A类私有:10.0.0.1----10.255.255.254 B类私有:172 ...

  9. python3中装饰器的用法总结

    装饰器预备知识点 1 函数赋值给一个变量 函数名可以像普通变量一样赋值给另一个变量. def test(): print("i am just a test function") ...

  10. Bentley二次开发中的，沿曲线构造拉伸实体问题

    引用文件:Bentley.Interop.MicroStationDGN 本人开发过程中遇到问题: 创建多个线段及弧线,通过自动创建复杂链获得,沿曲线构造拉伸实体的Path参数,拉伸曲线路径首尾特别近 ...