<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<script src="https://cdn.bootcss.com/angular.js/1.4.6/angular.min.js"></script>

</head>

<body>

<div ng-app="myApp" ng-controller="myCtrl">

<select ng-init="selectedName = names[0]" ng-model="selectedName" ng-options="x for x in names">

</select>

<div> 你选择了：{{selectedName}}</div>

<button ng-click="getNames()">点我！</button>

</div>

<script>

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

app.controller('myCtrl', function($scope) {

    $scope.names = ["Google", "Runoob", "Taobao"];

    $scope.getNames = function() {

        $scope.names = ["http", "get", "data"];

    };

});

</script>

<p>该实例演示了 ng-options 指令的使用。</p>

</body>

</html>

AngularJS 下拉列表demo的更多相关文章

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

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

  2. AngularJS入门-demo

    双向绑定测试: <body ng-app> 请输入姓名:<input ng-model="myname"> <br> {{myname}},你好 ...

  3. AngularJS +HTML Demo

    <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="C ...

  4. AngularJS入门Demo

    1 :表达式 <html> <head> <title>入门小Demo-1</title> <script src="angular.m ...

  5. AngularJs Test demo &front end MVVM implementation conjecture and argue.

    <!DOCTYPE html> <html> <head> <title></title> <meta charset="u ...

  6. angularjs transclude demo

    <!doctype html> <html lang="en" ng-app="expanderModule"> <head> ...

  7. angularjs ngRoute demo

    <!doctype html> <html lang="en" ng-app="AMail"> <head> <met ...

  8. angularjs $watch demo

    <!doctype html> <html lang="en" ng-app> <head> <meta charset="UT ...

  9. vue1 get,post交互及百度下拉列表demo

随机推荐

  1. centos6.6--------正向DNS配置

    一.正向区: 将域名解析为IP====================================================================================注 ...

  2. javascript中caller和callee call和apply

    Arguments : 该对象代表正在执行的函数和调用它的函数的参数. [function.]arguments[n] 参数function :选项.当前正在执行的 Function 对象的名字. n ...

  3. jsp指令介绍

    JSP指令(directive)是为JSP引擎而设计,它们并不直接产生任何可见输出,而只是告诉引擎如何处理JSP页面中的其余部分. 在JSP 2.0规范中定义了三个指令: 1.page指令 2.inc ...

  4. RawURL

    Request.RawUrl表示当前页面, Response.Redirect重新打开页面. 意思就是重新打开当前页面. 和下面一样的 string url=Request.RawUrl: Respo ...

  5. [翻译]内存一致性模型 --- memory consistency model

    I will just give the analogy with which I understand memory consistency models (or memory models, fo ...

  6. span可编辑 属性 html 可编辑td

    <span contenteditable="true">11111111111111111</span> <!DOCTYPE html PUBLIC ...

  7. PhotoZoom Classic 7怎么样？对电脑和系统要求高不高？

    PhotoZoom Classic 7怎么样?对电脑和系统要求高不高? 相较于更专业PhotoZoom Pro,标准版本的PhotoZoom Classic 7更适用于日常工作中的图片放大处理,例如在 ...

  8. Java中 对象的创建于调用

    Main方法是程序的主入口,想要用某个方法必须在main方法中调用 创建对象: 类名 对象名 = new 类名(); 使用对象访问类中的成员: 对象名.成员变量: 对象名.成员方法(); 成员变量的默 ...

  9. HDU 2522 A simple problem（ 分数循环节 ）

    链接:Here! 思路:模拟除法,当余数再次出现的时候一定是遇到了循环节( 可看下图例子 ),否则的话继续除法的步骤,直到被除数为 0 . 注意:这道题不需要重新申请一个数组来单独存放答案,如果符合要 ...

  10. POJ 2376 Cleaning Shifts (线段树优化DP)

    题目大意:给你很多条线段,开头结尾是$[l,r]$,让你覆盖整个区间$[1,T]$,求最少的线段数 题目传送门 线段树优化$DP$裸题.. 先去掉所有能被其他线段包含的线段,这种线段一定不在最优解里 ...