ionic准备之angular基础——dom操作相关(6)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.red{color:#f00;}
.blue{color:#036;} /*后面的覆盖前面的样式*/
</style>
</head>
<body ng-app="myApp">
<div ng-controller="firstController">
<!--ng-focus使用-->
<input type="text" ng-focus="getAa()" ng-blur="getbb()"> <!--ng-selected使用-->
<input type="checkbox" ng-model="sel">
<select name="" id="">
<option value="">1111</option>
<option value="" ng-selected="sel">2222</option>
<option value="">3333</option>
</select> <!--ng-change的使用-->
<input type="checkbox" ng-model="cc" ng-change="change()"> <!--ng-class的使用-->
<div ng-class="{red:true,blue:true}">我是中国人</div> <!--ng-style的用法,,,,,,注意颜色值需要加单引号-->
<div ng-style="{color:'#F00'}">我是中国人</div> <!--ng-href-->
<a ng-href="http://www.baidu.com">百度</a> <!--ng-show 还有ng-hide,但是建议使用ng-show,改变他的值就好了,其他的ng-hide ng-if可以不使用-->
<div ng-show="true">ng-show</div>
</div>
</body>
<script src="angular/angular.js"></script>
<script type="text/javascript">
var app=angular.module("myApp",[]); app.controller('firstController',function($scope){
$scope.getAa=function(){
alert();
}
$scope.getbb=function(){
alert("bb");
} $scope.change=function(){
if($scope.cc==true){
alert("选中");
}else{
alert("未选中");
}
} }) </script>
</html>
这节比较简单,不记得怎么用可以看看api都不会有太大的问题
所以也没有用太大的篇幅去写了
就在刚刚,我朋友说如果是新的项目就不要用ionic了,建议用react native,大家觉得怎样
当然我也会研究react,到时候对比一下。
ionic准备之angular基础——dom操作相关(6)的更多相关文章
- angular的Dom操作
原文 https://www.jianshu.com/p/9d7249922bda 大纲 1.angular的DOM操作 2.为什么不能直接操作DOM? 3.三种错误操作DOM的方式 4.angula ...
- JQuery基础DOM操作
DOM创建节点及节点属性 通过JavaScript可以很方便的获取DOM节点,从而进行一系列的DOM操作.但实际上一般开发者都习惯性的先定义好HTML结构,但这样就非常不灵活了. 试想下这样的情况:如 ...
- javascript基础DOM操作
DOM 中的三个字母,D(文档)可以理解为整个 Web 加载的网页文档:O(对象)可以理解为类似 window 对象之类的东西,可以调用属性和方法,这里我们说的是 document对象:M(模型)可以 ...
- DOM操作相关案例 模态对话框,简易留言板,js模拟选择器hover,tab选项卡,购物车案例
1.模态框案例 需求: 打开网页时有一个普通的按钮,点击当前按钮显示一个背景图,中心并弹出一个弹出框,点击X的时候会关闭当前的模态框 代码如下: <!DOCTYPE html> <h ...
- 重撸js_2_基础dom操作
1.node 方法 返回 含义 nodeName String 获取节点名称 nodeType Number 获取节点类型 nodeValue String 节点的值(注意:文本也是节点) 2.inn ...
- HTML基础—DOM操作
DOM(Document Object Model文档对象模型) 一个web页面大的展示,是由html标签组合成的一个页面,dom对象实际就是将html标签转换成了一个文档对象.可以通过dom对象中j ...
- ionic准备之angular基础———服务provider 和 factory和service(9)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- ionic准备之angular基础——格式化数据以及过滤器(8)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- ionic准备之angular基础——模板引入(7)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
随机推荐
- wget下载整个网站的方法
转自: http://blog.itpub.net/29867/viewspace-716088/ (修改部分内容) wget --restrict-file-name=ascii -m -c -n ...
- 基于Xen实现一种domain0和domainU的应用层数据交互高效机制 - 3
继续 上一篇 的研究,结合 xen4.2.3 的代码分析,发现 xen4.2.3 的应用层工具库 tools 包含一个工具叫 libvchan ,其头文件描述如下: * This is a libra ...
- "select一直返回0"的问题解决和总结
场景:一个简单的TCP 服务器,以实现UPNP的事件体系结构 我在linux平台下,创建一个TCP套接字,绑定到49156端口,向UPNP SERVER发一个subscribe订阅请求,超时时间设置为 ...
- 使用bottle进行web开发(3):静态文件的获取
静态文件(比如css啊,需要下载的各位文件等),需要通过static_file来操作,首先记得要在import中导入 @route('/static/<filename>') def se ...
- Tomcat服务器与HTTP协议
Tomcat服务器与HTTP协议 一. Tomcat服务器 1.tomcat服务器 1.web :网页,它代表的是网络上的资源.(java技术开发动态的web资源,即动态web页面,在Java中,动 ...
- poj1743(后缀数组)
poj1743 题意 给出一个数字序列(串),现在要去寻找一个满足下列条件的子串: 长度不小于 5 存在重复的子串(如果把一个子串的所有数字都加上或减去一个值,与另一子串的数字对应相同,我们称它们重复 ...
- 洛谷——2722总分 Score Inflation
题目背景 学生在我们USACO的竞赛中的得分越多我们越高兴. 我们试着设计我们的竞赛以便人们能尽可能的多得分,这需要你的帮助 题目描述 我们可以从几个种类中选取竞赛的题目,这里的一个"种类& ...
- docker网络 存储卷 Dockerfile 私有registry
1.bridge模式 docker run --name bu1 -it --network bridge --rm busybox # 相当于 docker run --name bu1 -it - ...
- [BZOJ4398]福慧双修/[BZOJ2407]探险
题目大意: 给定一个$n(n\leq40000)$个点$m(m\leq100000)$条边的有向图,求从$1$出发回到$1$的不经过重复结点的最短路. 思路: 首先Dijkstra求出从1出发到每个结 ...
- [Luogu1429]平面最近点对(加强版)
题目大意: 平面最近点对. 思路: 分治. 首先将所有点排序 每次把当前区间分为两半,递归求解两个区间内部的情况,然后枚举区间两边的点. #include<cmath> #include& ...