昨天需要在项目使用Angular.js的select，测试了好久才研究出怎么进行赋值，操作。

HTML代码

<!DOCTYPE html>

<html>

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

        <script src="http://cdn.bootcss.com/angular.js/1.3.0-beta.11/angular.min.js"></script>

        <title>RunJS</title>

    <link id="bootstrap_221" rel="stylesheet" type="text/css" class="library" href="/js/sandbox/bootstrap-2.2.1/css/bootstrap.min.css">

    <script id="jquery_172" type="text/javascript" class="library" src="/js/sandbox/jquery/jquery-1.7.2.min.js"></script>

    <script id="bootstrap_221" type="text/javascript" class="library" src="/js/sandbox/bootstrap-2.2.1/js/bootstrap.min.js"></script>

    </head>

</html>

JS代码：

var appDemo = angular.module('appDemo',[]);

appDemo.controller('selectDemo',function($scope){

    $scope.itemList=[

        {value:0,class:'水果',name:'苹果',color:'红色'},

        {value:1,class:'水果',name:'香蕉',color:'黄色'},

        {value:2,class:'蔬菜',name:'茄子',color:'紫色'},

        {value:3,class:'水果',name:'葡萄',color:'紫色'},

        {value:4,class:'水果',name:'黄瓜',color:'绿色'},

        {value:5,class:'水果',name:'鸭梨',color:'黄色'},

        {value:6,class:'蔬菜',name:'菠菜',color:'绿色'},

    ];

});

RunJs演示地址

AngularJs的Select演示的更多相关文章

  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的正确姿势

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

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

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

随机推荐

  1. 「Poetize3」导弹防御塔

    描述 Description Freda控制着N座可以发射导弹的防御塔.每座塔都有足够数量的导弹,但是每座塔每次只能发射一枚.在发射导弹时,导弹需要T1秒才能从防御塔中射出,而在发射导弹后,发射这枚导 ...

  2. awk文本处理--二维数组使用一例

    群友出的题: 原始文件: $ cat fileBJ30 26BJ30 24BJ30 63BJ30 70SH41 21SH41 30SH41 25SH41 25SH41 29SD15 34SD15 46 ...

  3. JavaScript中的声明提升

    JavaScript中变量或者函数的声明会被提升(赋值语句不会被提升)到当前函数主体的顶部,不管这个声明是否出现在不可到达的地方. var test = 1; function f() { if(!t ...

  4. 《A First Course in Probability》-chaper1-组合分析-方程整数解的个数

    在概率论问题中求解基本事件.某个事件的可能情况数要涉及到组合分析. 而这一部分主要涉及到简单的计数原理和二项式定理.多项式定理. 我们从一个简单的实例入手. 方程的整数解个数: Tom喜欢钓鱼,一直他 ...

  5. inux常用命令大全

    系统信息 arch 显示机器的处理器架构(1) uname -m 显示机器的处理器架构(2) uname -r 显示正在使用的内核版本 dmidecode -q 显示硬件系统部件 - (SMBIOS ...

  6. Redis 实现用户积分排行榜

    排行榜功能是一个很普遍的需求.使用 Redis 中有序集合的特性来实现排行榜是又好又快的选择. 一般排行榜都是有实效性的,比如“用户积分榜”.如果没有实效性一直按照总榜来排,可能榜首总是几个老用户,对 ...

  7. 为什么使用spring Struts 等框架开发

    转载自:http://www.cnblogs.com/sharpxiajun/p/3936268.html 今年我一直在思考web开发里的前后端分离的问题,到了现在也颇有点心得了,随着这个问题的深入, ...

  8. PHP中统计目录中文件以及目录中目录的大小

    <?php  #循环遍历目录中所有的文件,并统计目录和文件的大小  $dirName="phpMyAdmin";  $dir=opendir($dirName);  #返回一 ...

  9. UVA 10668 - Expanding Rods(数学+二分)

    UVA 10668 - Expanding Rods 题目链接 题意:给定一个铁棒,如图中加热会变成一段圆弧,长度为L′=(1+nc)l,问这时和原来位置的高度之差 思路:画一下图能够非常easy推出 ...

  10. Spring中的AOP

    什么是AOP? (以下内容来自百度百科) 面向切面编程(也叫面向方面编程):Aspect Oriented Programming(AOP),通过预编译方式和运行期动态代理实现程序功能的统一维护的一种 ...