angularjs1-5，class，
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="angular.min.js"></script>
<style>
.red{ background:red; color:blue;}
.yellow{ background:yellow;}
</style>
</head>
<body>
<div ng-app="myApp">
<div ng-controller="firstController">
<div ng-cloak ng-class="{red:s}">{{text}}</div>
<div ng-cloak ng-class="{{sClass}}">{{text}}</div>
<div ng-cloak ng-style="{color:'red'}">{{text}}</div>
<div ng-cloak ng-style="{{style}}">{{text}}</div>
<a href="{{url}}">百度1</a>
<a ng-href="{{url}}">百度</a>
<img src="{{src}}" />
<img ng-src="{{src}}" />
<br>
<br>
<a ng-href="{{url}}" ng-attr-title="{{text}}">百度</a>
<br>
<br>
<div ng-show="s">你好</div> //dispaly显示隐藏
<br>
<br>
<div ng-if="s">你好</div> //dom的移除和没有移除
<div ng-switch on="s">
<p ng-switch-default>默认的效果</p>
<p ng-switch-when="false">false切换的效果</p>
<p ng-switch-when="true">true切换的效果</p>
</div>
<br>
<br>
<div class="animate-switch-container"
ng-switch on="selection">
<div class="animate-switch" ng-switch-when="settings">Settings Div</div>
<div class="animate-switch" ng-switch-when="home">Home Span</div>
<div class="animate-switch" ng-switch-default>default</div>
</div>
<input type="checkbox" ng-model="open"><br/>
<details id="details" ng-open="open">
<summary>Copyright 2011.</summary>
<p>All pages and graphics on this web site are the property of W3School.</p>
</details>
</div>
</div>
<script type="text/javascript">
var app = angular.module("myApp", []);
app.controller('firstController',function($scope){
$scope.text='phonegap中文网';
$scope.s=true;
$scope.sClass = "{red:true,yellow:true}";
$scope.style = "{color:'red',background:'yellow'}";
$scope.url='http://www.baidu.com';
$scope.src='http://www.baidu.com/img/bdlogo.png';
// $scope.style = "{color:'red',background:'yellow'}";
// $scope.sClass = "{red:true,yellow:true}";
// $scope.url = "http://www.baidu.com";
$scope.items = ['settings', 'home', 'other'];
$scope.selection = $scope.items[0];
});
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="angular.min.js"></script>
<script type="text/javascript" src="http://cdn.bootcss.com/angular.js/1.4.0-beta.6/angular-sanitize.min.js"></script>
</head>
<body>
<div ng-app="myApp">
<div ng-controller="firstController">
<div ng-click="run()">点击</div>
<div ng-bind="text"></div>
//绑定多个
<div ng-bind-template="{{text}} {{name}}"></div>
//1.引入angular-sanitize，2.依赖['ngSanitize']
<div ng-bind-html="text2"></div>
</div>
</div>
<script type="text/javascript">
var app = angular.module("myApp", ['ngSanitize']);
app.controller('firstController',function($scope){
$scope.text='phonegap中文网';
$scope.name='中文网';
$scope.text2='<h2>这是h2</h2>';
$scope.run=function(){
alert('run');
console.log('run');
}
});
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="../angular.min.js"></script>
<script type="text/javascript" src="http://cdn.bootcss.com/angular.js/1.4.0-beta.6/angular-sanitize.min.js"></script>
</head>
<body>
<div ng-app="myApp">
<div ng-controller="firstController">
<div ng-repeat="innerList in list" ng-init="outerIndex = $index">
<div ng-repeat="value in innerList" ng-init="innerIndex = $index">
<span class="example-init">list[ {{outerIndex}} ][ {{innerIndex}} ] = {{value}};</span>
</div>
</div>
<input type="text" ng-model="name" ng-model-options="{ updateOn: 'blur' }" />
{{name}}
</div>
</div>
<script type="text/javascript">
var app = angular.module("myApp", ['ngSanitize']);
app.controller('firstController',function($scope){
$scope.list = [['a', 'b'], ['c', 'd']];
});
</script>
</body>
</html>
angularjs1-5，class，的更多相关文章
- 逆天通用水印支持Winform，WPF，Web，WP，Win10。支持位置选择（9个位置 ==》[X]）
常用技能:http://www.cnblogs.com/dunitian/p/4822808.html#skill 逆天博客:http://dnt.dkil.net 逆天通用水印扩展篇~新增剪贴板系列 ...
- MySQL主从环境下存储过程，函数，触发器，事件的复制情况
下面,主要是验证在MySQL主从复制环境下,存储过程,函数,触发器,事件的复制情况,这些确实会让人混淆. 首先,创建一张测试表 mysql),age int); Query OK, rows affe ...
- Oracle安装部署，版本升级，应用补丁快速参考
一.Oracle安装部署 1.1 单机环境 1.2 Oracle RAC环境 1.3 Oracle DataGuard环境 1.4 主机双机 1.5 客户端部署 二.Oracle版本升级 2.1 单机 ...
- Syscall，API，ABI
系统调用(Syscall):Linux2.6之前是使用int0x80(中断)来实现系统调用的,在2.6之后的内核是使用sysentry/sysexit(32位机器)指令来实现的系统调用,这两条指令是C ...
- 【夯实PHP基础】PHP数组，字符串，对象等基础面面观
本文地址 分享提纲 1.数组篇 2.字符创篇 3.函数篇 4.面向对象篇 5.其他篇 /*************************** 一.数组篇 Begin***************** ...
- MSSQL 事务，视图，索引，存储过程，触发器
事务 事务是一种机制.是一种操作序列,它包含了一组数据库操作命令,这组命令要么全部执行,要么全部不执行. 在数据库系统上执行并发操作时事务是作为最小的控制单元来使用的.这特别适用于多用户同时操作的数据 ...
- 谁偷了我的热更新？Mono，JIT，iOS
前言 由于匹夫本人是做游戏开发工作的,所以平时也会加一些玩家的群.而一些困扰玩家的问题,同样也困扰着我们这些手机游戏开发者.这不最近匹夫看自己加的一些群,常常会有人问为啥这个游戏一更新就要重新下载,而 ...
- Atitit 知识管理的重要方法 数据来源，聚合，分类，备份，发布 搜索
Atitit 知识管理的重要方法 数据来源,聚合,分类,备份,发布 搜索 1.1. Rss 简易信息聚合(也叫聚合内容 Really Simple Syndication1 1.1. Rss 简易信息 ...
- APP测试点总结(功能，交互，死机崩溃状态分析，容易出错的检查点）
APP测试点总结(功能,交互,死机崩溃状态分析,容易出错的检查点) 版权声明:本文为博主原创文章,未经博主允许不得转载. 最近涉足APP端测试,常见检查点总结如下: 一.业务方面: 1. 注册( ...
- 计算机人物系列-Mauchly，Eckert，Goldstine
关键词:莫尔学院(Moore School),阿伯丁试验场(Aberdeen Proving Ground), 雷明顿兰德公司(Remington Rand Corporation), IBM院士(I ...
随机推荐
- C# 同步更新系统时间
前言 在定位用户问题时,发现有些电脑,会出现系统时间不是最新的问题. 可能原因: 取消了勾选服务器时间同步 当前安装的系统,是一个未知来源系统,导致系统时间更新失败 而系统时间不正确,会导致IE选项- ...
- BZOJ 3065 替罪羊树+动态开节点线段树
思路: RT 可以看VFK的题解 我写了半天拍了半天... 不过是$nlog^2n$的 要写垃圾回收的 线段树 如果某个节点的sum是0 也可以free掉 //By SiriusRen #inclu ...
- [转]C# ListView 单击标题实现排序(在转载的基础上有所完善)
using System; using System.Collections; using System.Windows.Forms; //在转载的基础上有所完善 namespace TDRFacto ...
- iphone通讯录的备份与恢复
最近在做iOS系统通讯录备份到服务器,并且可以从服务器中下载备份文件恢复到手机的功能,部分实现细节记录如下. 将iphone系统通讯录生成.vcf文件 ABAddressBookRef address ...
- nodeJs配置相关以及JSON.parse
nodeJs配置相关 实际上说应用相关更好吧,我不是很懂. 今天在工作中,被同事解决了一个问题,虽然多花了一些额外时间,但长痛不如短痛嘛 实际上的问题就是npm run target等命令可以,但是n ...
- （转） RabbitMQ学习之spring整合发送同步消息（注解实现）
http://blog.csdn.net/zhu_tianwei/article/details/40918477 上一篇文章通过xml配置rabbitmq的rabbitTemplate,本节将使用注 ...
- 优动漫PAINT用户界面介绍
使用优动漫PAINT能够快速实现工程巨大的漫画.插画以及动画,从13年发布至今一直备受好评,目前优动漫PAINT1.6.6.1是最新的版本,新版本的完善也受到更多年轻伙伴的青睐,使用优动漫PAINT可 ...
- APICloud开发小技巧（一）
apicloud开发文档中,前端开发框架指的就是,类似jq\js的语法: https://docs.apicloud.com/Front-end-Framework/framework-dev-gui ...
- ArrayList集合如何存储基本数据类型
ArrayList对象不能存储基本类型,只能存储引用类型的数据.类似 <int> 不能写,但是存储基本数据类型对应的包装类型是可以的. 所以,想要存储基本类型数据, <> 中的 ...
- SaltStact自动化运维工具01
什么是saltstackSaltstack是基于python开发的一套C/S架构配置管理工具使用SSL证书签方的方式进行认证管理底层使用ZeroMQ消息队列pub/sub方式通信 – 号称世界 ...