angular中的ng-options 用法

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="../js/angular-1.3.0.js" ></script>
</head>
<body>
<div ng-app="hd" ng-controller=‘ctrl‘>
<select ng-options=" v.value as v.name for v in data" ng-model="city">
<option value=‘‘>请选择</option>
</select>
{{city}}
</div>
<script>
var m = angular.module(‘hd‘,[]);
m.controller(‘ctrl‘,[‘$scope‘,function($scope){
$scope.city=‘qing hua‘; //默认选中
$scope.data=[{name:‘北大‘,value:‘bei da‘},{name:‘清华‘,value:‘qing hua‘},{name:‘南开‘,value:‘nankai‘}];
}]);
</script>
</body>
</html>

时间: 2024-12-09 21:31:49

angular中的ng-options 用法的相关文章

angular中的子路由用法

Angular ui-route的用法 引入angular和使用angular子路由时需要的依赖模块angular-ui-route.js.并且在html中将路由要插入的位置写上.而在js部分中和angular路由一样在控制台外面写 <body> <div ui-view></div> </body> <script src="js/angular.min.js" type="text/javascript" c

angular中的ng.function

网址:http://www.angularjsapi.cn/#/copy angular.bind 描述:函数以及参数的动态绑定,返回值为动态绑定之后的函数.其中args是可选的动态参数,self在fn中使用this调用. 使用方法是:angular.bind(self,fn,args) 其中self的参数类型是obj,fn的参数类型是function,args传入fn的参数. 例子: var self = {zhaunglongfei:"boyi"};var f = angular.

Angular中的$q的形象解释及深入用法

作者:寸志链接:https://zhuanlan.zhihu.com/p/19622332来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 早上,老爸说:"儿子,天气如何?" 每周一早上,老爸问儿子下午的天气情况,儿子可以到自家房子旁边小山上使用望远镜来观看.儿子在出发时许诺(Promise)老爸(会通知老爸天气情况). 此刻,老爸决定,如果天气不错,明天就出去捕鱼,否则就不去.而且如果儿子无法获得天气预报的话,也不去捕鱼. 30分钟左右,儿子回来了,每周

angular中出现错误的提示指令[ng:areq]的原因

angular.min.js:80 Error: [ng:areq] http://errors.angularjs.org/1.2.9/ng/areq?p0=sellerService&p1=not%20a%20function%2C%20got%20undefined at angular.min.js:2 at ub (angular.min.js:14) at Pa (angular.min.js:14) at angular.min.js:57 at angular.min.js:45

Angular中的内置指令和自定义指令

NG中的指令,到底是什么(what)? 为什么会有(why)?以及怎样使用(how)? What: 在NG中,指令扩展HTML功能,为 DOM 元素调用方法.定义行为绑定数据等. Why: 最大程度减少DOM操作,实现数据绑定,与业务逻辑进行交互. How: 指令主要分为两种:内置指令和自定义指令,通过下面的例子,简单记录一下如何去使用. 内置指令 在官方API文档上罗列了很多指令,内置指令可以分为:普通指令 和 事件指令,他们都是作用于HTML之上的,通过添加属性的方式来实现的.简单看一下一些

在 Angular 中实现搜索关键字高亮

在 Angular 中,我们不应该试图直接修改 DOM 的内容,当需要更新 DOM 内容的时候,应该修改的其实是我们的数据模型,也就是 $scope 中的数据,Angular 会帮助我们将修改之后的数据展示在页面中. 但是,在有些情况下,比如我们有一个搜索框,希望将搜索的关键字在正文中高亮出来,这时候就会感觉比较吃力了,filter 可以帮助我们处理这种情况. 实际上,很多时候,我们的数据是不能直接输出到 DOM 中的,典型的比如日期,或者货币等等,通常需要将我们内部的数据格式化之后,再输出到页

angular中模板

<!DOCTYPE html><!--调用模块--><html lang="en" ng-app="myApp"><head> <meta charset="UTF-8"> <script src="js/angular.js"></script> <title>Title</title></head><

IOS中NSString的常见用法

iOS NSString的常用用法 //1.创建常量字符串. NSString *astring = @"This is a String!"; //2.创建空字符串,给予赋值. NSString *astring = [[NSString alloc] init]; astring = @"This is a String!"; //3.在以上方法中,提升速度:initWithString方法 NSString *astring = [[NSString allo

angularjs中ng-repeat-start与ng-repeat-end用法实例

angularjs中ng-repeat-start与ng-repeat-end用法实例 <!DOCTYPE html> <html lang="zh-CN" ng-app="app"> <head> <meta charset="utf-8"> <title>ng-repeat-start 与 ng-repeat-end的用法</title> <link rel=&qu

Angular中使用webpack

最近,在开发公司项目的时候,由于组件太多,发出请求太多,导致网站速度太慢,所以我们就有一种强烈的需求,那就是对开发的js进行打包.在对比了各种打包工具之后,最后我们选定了webpack.所以,在这一周除了研究了下如何跨域请求,最主要的时间都去研究webpack去了,虽然没有达到理想中的状态,但是基本的需求应该算是满足了,现在分享出来,希望对大家学习Angular有所帮助. 在正文之前,我先说下,我要分享的内容有: · webpack在Angular中使用 · 建立开发环境与生产环境 · 优化打包