ng-select 下拉的两种方式
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
</head>
<body>
<div ng-app="myapp" ng-controller="myctrl">
<select ng-model="data" >
<option value="">选择地址</option>
<option ng-repeat="x in name">{{x}}</option>
</select>
</div>
<div ng-app="app1" ng-controller="myctrl1" id="a">
<select ng-options="x for x in name" ng-model="name">//必须添加ng-model
<option value=""></option>
</select>
<select ng-model="p" ng-options="x.id as x.name for x in gg"></select>//便利数组对象
{{p}}//输出对象的ID
<select ng-model="a" ng-options="x.id as x.name group by x.key for x in gs"></select>//便利jeson并分组
</div>
</body>
<script src="js/angurlar素材/angular/angular.js"></script>
<script>
var app =angular.module("myapp",[]).controller("myctrl",function($scope){
$scope.name=["关关","xsss","sss"]
});//运用ng-repeat完成项目
var a=document.querySelector("#a");
console.log(a)
angular.module("app1",[]).controller("myctrl1",function($scope){
$scope.name=["关关","x","sss"]//定义数组
$scope.gg=[{id:1,name:"guanguan"}
{id:2,name:"kankang"}
]
$scope.gs=[
{id:1,name:"关关",key:"我的好友"},
{id:2,name:"中中",key:"我的好友"},
{id:3,name:"亮亮",key:"我的好友"},
{id:4,name:"小小",key:"黑名单"},
]
});//运用ng-options完成
angular.bootstrap(a,["app1"])//运用bootstrop完成多个模块加载
</script>
</html>
ng-select 下拉的两种方式的更多相关文章
- js进阶 12-16 jquery如何实现通过点击按钮和按下组合键两种方式提交留言
js进阶 12-16 jquery如何实现通过点击按钮和按下组合键两种方式提交留言 一.总结 一句话总结:实现按下组合键提交留言是通过给input加keydown事件,判断按键的键码来实现的. 1.如 ...
- SpringMVC之ajax+select下拉框交互常用方式
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- Spring IOC 依赖注入的两种方式XML和注解
依赖注入的原理 依赖注入的方式---XML配置 依赖注入的方式---注解的方式 Spring 它的核心就是IOC和AOP.而IOC中实现Bean注入的实现方式之一就是DI(依赖注入). 一 DI的原理 ...
- HTTP/HTTPS GET&POST两种方式的实现方法
关于GET及POST方式的区别请参照前面文章:http://www.cnblogs.com/hunterCecil/p/5698604.html http://www.cnblogs.com/hunt ...
- 在angular中实现下拉框的两种方式 ng-repeat和 ng-option
1. ng-repeat实现下拉框: select下拉框里option组装成下拉框,这里利用ng-repeat指令来创建 实现源码 <!DOCTYPE html> <html&g ...
- EF5+MVC4系列(7) 后台SelectListItem传值给前台显示Select下拉框;后台Action接收浏览器传值的4种方式; 后台Action向前台View视图传递数据的四种方式(ViewDate,TempDate,ViewBag,Model (实际是ViewDate.Model传值))
一:后台使用SelectListItem 传值给前台显示Select下拉框 我们先来看数据库的订单表,里面有3条订单,他们的用户id对应了 UserInfo用户表的数据,现在我们要做的是添加一个Ord ...
- ListView下拉刷新及上拉更多两种状态
一.前言: 很多应用都会用到ListView,当然如果是iOS就会用UITableViewController,这两个控件在不同的OS上,功能是一样的,只是有些细微的不同(iOS的UITableVie ...
- CSharpGL(18)分别处理glDrawArrays()和glDrawElements()两种方式下的拾取(ColorCodedPicking)
CSharpGL(18)分别处理glDrawArrays()和glDrawElements()两种方式下的拾取(ColorCodedPicking) 我在(Modern OpenGL用Shader拾取 ...
- .NET环境下导出Excel表格的两种方式和导入两种类型的Excel表格
一.导出Excel表格的两种方式,其中两种方式指的是导出XML数据类型的Excel(即保存的时候可以只需要修改扩展名为.xls)和真正的Excel这两种. using System; using Sy ...
随机推荐
- hihocoder [Offer收割]编程练习赛52 D 部门聚会
看了题目的讨论才会做的 首先一点,算每条边(u, v)对于n*(n+1)/2种[l, r]组合的贡献 正着算不如反着算 哪些[l, r]的组合没有包含这条边(u, v)呢 这个很好算 只需要统计u这半 ...
- MySQL的学习记录(3.31更新)
MySQL的学习记录(3.31更新) 0x00 安装及配置 Windows 1.首先官网下载(https://dev.mysql.com/downloads/mysql/) ps:不想官网下载的可以到 ...
- 初学MySQL基础知识笔记--01
本人初入博客园,第一次写博客,在今后的时间里会一点点的提高自己博客的水平,以及博客的排版等. 在今天,我学习了一下MySQL数据库的基本知识,相信关于MySQL的资料网上会有很多,所以我就不在这里复制 ...
- 【总结】关于YUV-RGB格式转换的一些个人理解
这段时间一直在研究YUV的格式问题例如YUV422.YUV420,在网上搜索了很多这方面的资料,发现很多资料讲的东西是重复的,没有比较深入的讲解,所以看了之后印象不是很深,过了一段时间之后又对它们有了 ...
- 设计模式NO.1
设计模式NO.1 根据作业要求完成下列题目: 题目1: (1)要求:某系统日志记录器要求支持多种日志记录方式,如文件记录.数据库记录等:用户可以根据要求动态选择日志记录方式.使用Factory模式来设 ...
- tornado 采用 epoll 代理构建高并发网络模型
1 阻塞和非阻塞 对于阻塞和非阻塞,网上有一个很形象的比喻,就是说好比你在等快递,阻塞模式就是快递如果不到,你就不能做其他事情.非阻塞模式就是在这段时间里面,你可以做其他事情,比如上网.打游戏.睡觉 ...
- 20145237 《Java程序设计》第三周学习总结
20145237 <Java程序设计>第3周学习总结 教材学习内容总结 第四章主要讲了Java基本类型中的类类型,如何定义类.构造函数.使用标准类.基本类型打包器.数组复制.字符串等内容查 ...
- Ajax 的onreadystatechange事件注意事项.
<script type="text/javascript"> function createXHR() { var request = false; try { re ...
- windows 10下通过python3.6成功搭建jupyter 服务器
最近通过python学习爬虫技术,发现一个工具jupyter notebook很不错,该工具明显优势通过浏览器可以输入多行python代码,支持在线运行以及运行结果保存功能,在线验证python小模块 ...
- LeetCode & Q167-Two Sum II - Input array is sorted-Easy
Array Two Pointers Binary Search Description: Given an array of integers that is already sorted in a ...