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. YCSB测试HBase远程完全分布式集群

    写在前面 本文只讲一个很简单的问题,YCSB对HBase集群的测试.虽然网上有很多介绍YCSB测试HBase的文章,但都是针对本地HBase伪分布式集群的.大家都知道,稍微正式一些的压测都会要求测试客 ...

  2. lua 二维数组创建

    local arr= {} for i=1, 4 do arr[i] = {} end 使用时可以直接使用arr[i][j]

  3. Maven学习笔记二

    依赖范围 <dependency> <groupId>javax.servlet</groupId> <artifactId>servlet-api&l ...

  4. 深入理解C++ new/delete, new []/delete[]动态内存管理

    在C语言中,我们写程序时,总是会有动态开辟内存的需求,每到这个时候我们就会想到用malloc/free 去从堆里面动态申请出来一段内存给我们用.但对这一块申请出来的内存,往往还需要我们对它进行稍许的“ ...

  5. hibernate框架学习笔记7:HQL查询、Criteria查询简介

    HQL查询:hibernate独有的查询语言 适用于不复杂的多表查询 示例: 实体类: package domain; public class Customer { private Long cus ...

  6. 听翁恺老师mooc笔记(3)--指针的定义

    在上一个blog学习了&运算符,使用&取了变量.数组等地址,有什么用那?如果能够将取得的变量的地址传递给函数,能否通过这个地址在函数内访问到外部这个变量?答案是肯定的,scanf(&q ...

  7. alpha-咸鱼冲刺day8-紫仪

    总汇链接 一,合照 emmmmm.自然还是没有的. 二,项目燃尽图 三,项目进展 正在进行页面整合.然后还有注册跟登陆的功能完善-- 四,问题困难 数据流程大概是搞定了.不过语法不是很熟悉,然后还有各 ...

  8. Storm概念讲解和工作原理介绍

    Strom的结构 Storm与传统关系型数据库     传统关系型数据库是先存后计算,而storm则是先算后存,甚至不存     传统关系型数据库很难部署实时计算,只能部署定时任务统计分析窗口数据   ...

  9. 点击tableViewCell,调用打电话的功能

    对于点击tableViewCell,调用打电话的功能,按照一般的方法,使用Appdelegate的OpenUrl的方法,使用前先使用UIAlertView展示,让用户选择是否拨打,但是发现了个简单的方 ...

  10. animation & @keyframes 实现loading效果

    效果图截图如下: 直接上代码: html <!DOCTYPE html> <html> <head> <meta charset="utf-8&qu ...