1、点击事件

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
</head>
<body>
<div ng-app="myapp" ng-controller="myctrl">
<input ng-click="fun()" type="button" value="点击" />
<div id="box"></div>
</div>
</body>
<script src="js/angurlar素材/angular/angular.js"></script>
<script>
var app =angular.module("myapp",[]);
app.controller("myctrl",function($scope){
$scope.fun=function(){
box.innerHTML="你好"
}
})
</script>
</html>

2、防止闪烁问题

大家都知道在浏览器加载过程中是从上到下加载的，所以说在加载用angular写的页面时候会出现零点几毫秒的闪烁加载，我们可以用以下几种方法来消除闪烁问题

（1）ng-bind绑定指令

<div ng-app="myapp" ng-controller="myctrl">

　　　<span ng-bind="data"></span>

</div>

<script>

var app = angular.module("myapp",[]).controller("myctrl",function($scope){

$scope.data="你好";

}

</script>

(2)ng-cloak预先加载指令

<div ng-app="myapp" ng-controller="myctrl">

　　　<span ng-cloak>{{data}}</span>

</div>

<script>

var app = angular.module("myapp",[]).controller("myctrl",function($scope){

$scope.data="你好";

}

</script>

angular的时间指令 以及防止闪烁问题的更多相关文章

  1. Angular.js之指令学习笔记

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

  2. angular内置指令相关知识

    原文地址 https://www.jianshu.com/p/5a5b43a8e91f 大纲 1.angular指令的分类 2.angular指令之——组件 3.angular指令之——属性指令 (n ...

  3. angular.js的时间指令

    最后样式 html .input-group(style="max-width:150px") input.form-control(uib-datepicker-popup=&q ...

  4. Angular内置指令（二）

    目录: $rootScope,ng-app,.run(),ng-include,ng-repeat,ng-if,ng-switch,ng-init ng-show/ng-hide,ng-model,n ...

  5. Angular JS 中 指令详解

    Angular JS的强大功能就在于其可以自定义很多指令,现在就指令做一下详细的剖析. 一个Angular js 指令(directive)需要指定一个唯一的名字(myDirective)和一个函数, ...

  6. Angular的自定义指令以及实例

    本文章已收录于:  AngularJS知识库  分类: javascript(55)  http://www.cnblogs.com/xiaoxie53/p/5058198.html   前面的文章介 ...

  7. Angular内置指令（一）

    要注意的是不要把自己开发的指令以ng开头,以免与内置指令冲突  目录:ng-disabled,ng-readonly,ng-checked,ng-selected,ng-href,ng-src,ng- ...

  8. 秒味课堂Angular js笔记------指令

    1.属性指令 angularjs样式相关指令: ng-class ng-style ng-href ng-src ng-attr-(suffix) ng-bind ng-cloak  没解析完之前标签 ...

  9. angular+bootstrap分页指令案例

    AngularJS中不仅内置了许多指令,而且开发人员也可以通过自定义指令来完成特殊操作,指令创建成功后可以到处复用. Web应用中的分页处理最为常见,我们可以将分页模块编写成一个可以复用的Angula ...

随机推荐

  1. [poj2585]Window Pains_拓扑排序

    Window Pains poj-2585 题目大意:给出一个4*4的方格表,由9种数字组成.其中,每一种数字只会出现在特定的位置,后出现的数字会覆盖之前在当前方格表内出现的.询问当前给出的方格表是否 ...

  2. java基础笔记（10）----集合之set集合

    set接口特点: 存储任意Object元素 无序,无下标,元素内容不可以重 方法: 继承父接口Collection中的所有方法 遍历: 有两种遍历方法,foreach遍历和迭代遍历 forEach遍历 ...

  3. ECEF和大地坐标系的相互转化

    在阅读 RTKLIB的源码时,发现了ECEF和大地坐标系的相互转换的函数,大地坐标系(φ,λ,h)转成ECEF(X,Y,Z)与所看书籍(GPS原理与接收机,谢刚,电子工业出版社)的公式是一样的,而EC ...

  4. oracle导入dmp文件的2种方法

    使用imp.impdp方式导入数据 1.使用imp导入数据 打开cmd窗口,然后直接敲入一下命令即可,需要注意的是,要事先把dmp文件放到正确的路径中去 imp yx_base/@yx_192. fi ...

  5. C语言博客作业--函数

    一.PTA实验作业 题目1 (6-7) (1).本题PTA提交列表 (2)设计思路 设计第一个函数判断是否完数int factorsum( int number ) 定义sum.i:sum初始化归0, ...

  6. Linux kernel 的 sendfile 是如何提高性能的

    Linux kernel 的 sendfile 是如何提高性能的 现在流行的 web 服务器里面都提供 sendfile 选项用来提高服务器性能,那到底 sendfile 是什么,怎么影响性能的呢? ...

  7. python的Flask 介绍

    Flask 介绍 知识点 微框架.WSGI.模板引擎概念 使用 Flask 做 web 应用 模板的使用 根据 URL 返回特定网页 实验步骤 1. 什么是 Flask? Flask 是一个 web ...

  8. "一不小心就火了"团队采访

    团队采访 一. 采访团队 团队:一不小心就火了 采访形式:线上问答 二.采访内容 你们是怎么合理地具体分配组员里的工作的?有些团队会出现个别组员代码任务很重,个别组员无所事事的情况,你们有什么有效的方 ...

  9. NOIP2016 天天爱跑步 80分暴力

    https://www.luogu.org/problem/show?pid=1600 题目描述 小c同学认为跑步非常有趣,于是决定制作一款叫做<天天爱跑步>的游戏.«天天爱跑步»是一个养 ...

  10. 关于Android 7.0（API24）相机的问题汇总

    在开发Android项目的时候,我们会用到相机,有些时候只是开发一个普通的扫码,仅仅赋予一下 权限 就好了,但是有些时候是需要拍照和从相册中获取照片的.我们在Android 5.0以及5.0之前调用相 ...