<!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. Aspose.Words将Word模板打印出来

    利用Aspose.Words将制作好的模板,输出出来自己所需的文件 /// <summary> /// 打印信息和列表 /// </summary> /// <param ...

  2. 7.Performance Statistics（性能统计）

    利用性能分析器中统计的数据,来分析和发现,其中的性能瓶颈点. 1.设置Statistic Options View>Live Options中的Statistic Options设置可以设置需要 ...

  3. 第二次作业&熟悉使用工具

     GIT地址  我的地址  GIT用户名  995020892w  学号后五位  81105  博客地址  我的博客  作业链接  第二次作业 一.环境配置过程 安装vs2017 因为以前学习C#相关 ...

  4. android黑科技系列——破解游戏之修改金币数

    我们在玩游戏的时候总是会遇到一些东东需要进行购买的,但是我们可能又舍不得花钱,那么我们该怎么办呢?那就是用游戏外挂吧!我们这里说的是Android中的游戏,在网上搜索一下移动端游戏外挂,可能会找到一款 ...

  5. GEF入门笔记

    最近项目中需要用到Eclipse GEF框架进行画图,故将平时学习笔记更新到博客中,便于查阅 自己画的一个GEF基本结构     最基本流程 1.创建model(包括数据域.在界面中的布局.图片索引等 ...

  6. php多线程操作数据库（转）

    PHP用pcntl可以实现多线程操作数据库.直接上代码,逻辑自己研究喽. 示例代码为: /** * 并发多线程运行任务,把任务拆解成区块,用多线程去并发执行 * @param callable $ex ...

  7. WIN系统查询版本

    cmd -> DISM /online /Get-CurrentEdition //查询系统版本 WIN+R -> slmgr.vbs -ipk 查询系统注册信息slmgr.vbs -dl ...

  8. maven中tomcat7：run无法启动maven项目

    这几天在学习ssm相关整合,在使用maven时,发现了一些问题,就是明明按代码都差不多就是没法运行 这个是maven主项目的pom.xml的配置,我解决的方法是添加 <maven.compile ...

  9. mysql备份脚本二（带日志）

    #!/bin/bashdb_PATH='/shareSAN/mysqldata/ocs/mysql_back_wjf' #备份文件保存的路径#db_DBNAME='sz_ocs' #备份的数据库名db ...

  10. Python可视化数据------seaborn

    可以看链接:https://blog.csdn.net/unixtch/article/details/78820654 1.import seaborn as sns 2.seaborn的主题风格( ...