<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body>

单选按钮
<div ng-app="hd" ng-controller="ctrl">
<input type="radio" ng-model="status" ng-value="1"/>开启
<input type="radio" ng-model="status" ng-value="0"/>关闭

<dvi ng-show="status==0">
正在维修中...
</dvi>

<br/><br/><br/><br/>

复选框
{{data}}
电影：<input type="checkbox" ng-model="data.game" ng-true-value="1" ng-false-value="0"/>
游戏：<input type="checkbox" ng-model="data.video" ng-true-value="1" ng-false-value="0"/>
<div ng-show="data.game==1">
<h1>电影爱好</h1>
</div>
<div ng-show="data.video==1">
<h1>游戏爱好</h1>
</div>
<br/><br/><br/><br/>
{{block}}

下拉列表
<select ng-options="v.value as v.name for v in city" ng-model="block"></select>
</div>
<script>
var m=angular.module('hd',[]);
m.controller('ctrl',['$scope',function($scope){
$scope.status=1;
$scope.data={game:0,video:0};

$scope.block='yongan'
$scope.city=[
{'name':'厦门','value':'xiamen'},
{'name':'泉州','value':'quanzhou'},
{'name':'永安','value':'yongan'},
];
}]);
</script>
</body>
</html>

angular笔记_3的更多相关文章

  1. angular笔记

    /** * Created by Administrator on 2016/5/3 0003. */ ng-app是告诉angularjs编译器把该元素当作编译的根 //定义模块 var myApp ...

  2. Angular笔记-select

    --select-- 设置默认选中值方法: <select ng-model="url" ng-options="x.url as x.site for x in ...

  3. angular笔记_7

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  4. angular笔记_6

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  5. angular笔记_5(全选/反选)

    全选和反选 BUG:当鼠标点击其中一个选项后,在点击全选按钮,该选项失效 <!DOCTYPE html><html lang="en"><head&g ...

  6. angular笔记_4(函数)

    angular.isString();是否字符串 angular.isNumber();是否数字 angular.isArray();是否数组 angular.isDate();是否日期/时间 ang ...

  7. angular笔记_2

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  8. angular笔记_1

    第一个angular文件<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js&q ...

  9. Angular 笔记系列（二）数据绑定

    数据绑定这块儿没啥说的,简单两个例子带过了. Hello World: <!DOCTYPE html> <html ng-app> <head> <title ...

随机推荐

  1. 2018.8.1 状压 CF482C 题解

    noip2016考了一道状压dp,一道期望dp 然而这题是状压期望dp... 所以难度是什么,省选noi吗... 怎么办... 题目大意: 给定n个字符串,甲从中任选出一个串(即选出每个串的概率相同为 ...

  2. Ubuntu下安装kate编辑器

    Ubuntu下安装kate编辑器   Ubuntu 下安装kate编辑器 #sudo apt-get install kate 安装kconsole #sudo apt-get install kco ...

  3. ecilpse运行Servlet程序是找不到路径的原因

    当工作空间路径有空格时,空格会被转成%20,将导致路径无法识别,于是就找不到路径了.

  4. 下载中间件--随机IP代理以及随机User_Agent

    下载中间件随机IP代理以及随机User_Agent 1.在settings.py中设置开启代理功能 # 设置下载中间件 DOWNLOADER_MIDDLEWARES = { # 随机的 User-Ag ...

  5. Linux环境安装Eclipse工具开发

    1.官网下载maven:https://maven.apache.org/download.cgi 2.上传到虚拟机进行解压缩操作: [hadoop@slaver1 package]$ tar -zx ...

  6. CentOS7安装wps

    https://blog.csdn.net/u010445843/article/details/77828552

  7. 分布式一致性算法——paxos

    一.什么是paxos算法 Paxos 算法是分布式一致性算法用来解决一个分布式系统如何就某个值(决议)达成一致的问题. 人们在理解paxos算法是会遇到一些困境,那么接下来,我们带着以下几个问题来学习 ...

  8. 带你了解zabbix整合ELK收集系统异常日志触发告警~

    今天来了解一下关于ELK的“L”-Logstash,没错,就是这个神奇小组件,我们都知道,它是ELK不可缺少的组件,完成了输入(input),过滤(fileter),output(输出)工作量,也是我 ...

  9. windows 设置开机启动,启动项

    第一步ctrl+R输入以下任意一个 方法一: C:\ProgramData\Microsoft\Windows\Start Menu\Programs\StartUp 方法二: shell:start ...

  10. BZOJ3796 Mushroom追妹纸 字符串 SA KMP

    原文链接https://www.cnblogs.com/zhouzhendong/p/9253173.html 题目传送门 - BZOJ3796 题意 找一个串 $w$ 满足: 1.$w$ 是 $s_ ...