angularjs的select使用2
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';}]);
<select ng-model="m.myColor" ng-options="color.name as color.name for color in colors">
</select>
</form>
<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 > |
angularjs的select使用2的更多相关文章
- AngularJS下拉列表select在option动态变化之后多出了一个错误项的问题
场景: Select初始化之后,选中select的某个选项 通过AngularJS更新select的选项 错误写法: HTML(使用ng-repeat) <div ng-app="Te ...
- AngularJS的select设置默认值
AngularJS的select设置默认值 在使用Angular时候使用select标签时会遇到绑定数据指定默认显示值可这样实现 <!DOCTYPE html> <html ng-a ...
- 关于angularjs的select下拉列表存在空白的解决办法
angularjs 的select的option是通过循环造成的,循环的方式可能有ng-option或者</option ng-repeat></option>option中 ...
- AngularJS初始化Select选择框
一.引入 之前一个离职的同事负责的项目大量的引入了AngularJS的JS框架,后来我接手相关他项目里的功能.由于对AngularJS不是太熟,在他的功能上进行二次开发就比较费劲了,印象比较深的一个就 ...
- Angularjs实现select的下拉列表
练习使用angularjs实现一个select下拉列表: <div ng-app="selectApp" ng-controller="selectControll ...
- AngularJS:Select
ylbtech-AngularJS:Select 1.返回顶部 1. AngularJS Select(选择框) AngularJS 可以使用数组或对象创建一个下拉列表选项. 使用 ng-option ...
- angularjs 下select中ng-options使用
当我有一堆object数据要用下拉框进行显示选择时,可以使用到angularjs中的select中的ng-options的属性.官网网址:https://docs.angularjs.org/api/ ...
- AngularJs的Select演示
昨天需要在项目使用Angular.js的select,测试了好久才研究出怎么进行赋值,操作. HTML代码 <!DOCTYPE html> <html> <head> ...
- angularJs绑定select的正确姿势
最近在项目中使用ionic,需要在页面上绑定一个年份下拉框,默认选中当前年,并且在下拉框的change事件中增加一些业务逻辑. 不管是使用ng-repeat还是ng-options,都是各种坑:默认选 ...
- angularJS中select元素的应用浅析
select array 数据: select ng-model 用法: 1.可以是一个对象形式,ng-model="test" $scope.test = {name: &quo ...
随机推荐
- window环境下pipd的安装
参照:https://blog.csdn.net/jin80506/article/details/83111848 如果你还是无法使用尝试查看是否自己已经将:C:\software\Python\P ...
- CTF | bugku | 秋名山车神
''' @Modify Time @Author ------------ ------- 2019/8/31 19:55 laoalo ''' import requests from lxml i ...
- 后端技术杂谈4:Elasticsearch与solr入门实践
阮一峰:全文搜索引擎 Elasticsearch 入门教程 作者:阮一峰 本系列文章将整理到我在GitHub上的<Java面试指南>仓库,更多精彩内容请到我的仓库里查看 https://g ...
- 使用Echarts中遇到值得记录的小案例(一)
需求部分 在开发项目的时候遇到一个需求,就是如何保证echarts图表里至少显示一个图例的数据(也就是最后一个图例不能变成unselected的状态)下图是最初加载时的画面 不想出现图例都被点击取消导 ...
- Qt/Qte/Qtopia三者的区别
Qt泛指 Qt software的所有版本的图像界面库,包括 Qt/X11(Unix/Linux),Qt Windows, Qt Mac 等,但这只是相对于二进制来说的.Qt作为一个跨平台的GUI 框 ...
- thinkphp5 redis使用
参数参考位置:thinkphp\library\think\cache\driver class Redis extends Driver { protected $options = [ 'host ...
- English-such as, for example, include and contain
such as 后接动词,通常用动名词,有时也可用动词原形 for example 后接动词,用动名词 include vt. 包含,包括 后接动词,用动名词 英英: If one thing inc ...
- 《图解设计模式》读书笔记6-1 VISITOR模式
目录 1. Visitor模式简介 2. 示例 2.1 类图 2.2 代码 3. 模式的角色和类图 4. 思路拓展 4.1 双重分发 4.2 开闭原则 4.3 难以增加ConcreteElement角 ...
- Gson字符串转换对象数组
public class Input { private String title; private int formId; private String content; public String ...
- upc组队赛16 GCDLCM 【Pollard_Rho大数质因数分解】
GCDLCM 题目链接 题目描述 In FZU ACM team, BroterJ and Silchen are good friends, and they often play some int ...