<div ng-app="myApp">

          <div ng-controller="firstController">

                <div ng-click="run()">点击{{text}}</div>

          </div>

      </div>

      <script type="text/javascript">

          var app = angular.module("myApp", []);

          app.controller('firstController',function($scope){

                $scope.text='phonegap中文网';

                  $scope.run=function(){

                      alert('run');

                      console.log('run');

                  }

          });

      </script>
<!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>

    </head>

    <body>

      <div ng-app="myApp">

          <div ng-controller="firstController">

              <input type="checkbox" ng-model="sel">

              <select>

                  <option>11111</option>

                  <option ng-selected="sel" >22222</option>

                  //select="selected"

              </select>

              <input type="checkbox" ng-change="change()" ng-model="c" />

              {{c}}

              <br>

              <input type="text" value="你好" ng-copy="aaa='按下复制键的时候执行的事件'">{{aaa}}

              <input type="text" value="你好" ng-cut="bbb='按下剪切键的时候执行的事件'">{{bbb}}

              <input type="text" value="你好" ng-paste="ccc='按下黏贴键的时候执行的事件'">{{ccc}}

              <br>

              <br>

              <div ng-bind="text"></div>

              <div ng-cloak>{{text}}</div> //防止加载慢出现{{}}

              <div ng-non-bindable>{{text}}</div>

          </div>

      </div>

      <script type="text/javascript">

          var app = angular.module("myApp", []);

          app.controller('firstController',function($scope){

              $scope.text='phonegap中文网';

              $scope.change=function(){

                if($scope.c==true){

                    alert('选中');

                }else{

                    alert('未选中');

                }

              }

          });

      </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>

    </head>

    <body>

      <div ng-app="myApp">

          <div ng-controller="firstController">

              <input type="button" ng-value="text" ng-disabled="isDisabled">

              <input type="text" value="{{text}}" ng-readonly="isDisabled">

              <input type="checkbox" value="{{text}}" ng-checked="isDisabled">

          </div>

      </div>

      <script type="text/javascript">

          var app = angular.module("myApp", []);

          app.controller('firstController',function($scope,$interval){

                $scope.n=5

                $scope.text= $scope.n+'秒';

                $scope.isDisabled=true;

               var time=$interval(function(){

                   $scope.n--;

                   $scope.text= $scope.n+'秒';

                   if($scope.n==0){

                       $interval.cancel(time);;

                       $scope.text='可以点击了';

                       $scope.isDisabled=false;

                   }

               },1000);

          });

      </script>

    </body>

</html>

angularjs1-4 事件指令的更多相关文章

  1. AngularJS1.X学习笔记4-内置事件指令及其他

    AngularJS为我们定义了一系列事件指令,方便我们对用户的操作作出响应.甚至他还有一个可选模块提供了触摸事件和手势事件的支持,为移动端开发提供了可能.现在开始学习一下AngularJS的事件指令. ...

  2. Angular——事件指令

    基本介绍 angular的事件指令都是ng-click,ng-blur....的形式,类似于js的事件 基本使用 <!DOCTYPE html> <html lang="e ...

  3. Vue之挂载点、变量、事件、js对象、文本指令、过滤器、事件指令和属性指令

    1.vue导入-挂载点 <!DOCTYPE html> <html lang="zh"> <head> <meta charset=&qu ...

  4. Vue框架（一）——Vue导读、Vue实例（挂载点el、数据data、过滤器filters）、Vue指令(文本指令v-text、事件指令v-on、属性指令v-bind、表单指令v-model)

    Vue导读 1.Vue框架 vue是可以独立完成前后端分离式web项目的js框架 三大主流框架之一:Angular.React.Vue vue:结合其他框架优点.轻量级.中文API.数据驱动.双向绑定 ...

  5. Angular使用操作事件指令ng-click传多个参数示例

    本文实例讲述了Angular使用操作事件指令ng-click传多个参数功能.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html ng-app="m ...

  6. 第一章、VUE-挂载点-实例成员-数据-过滤器-文本指令-事件指令-属性指令-表单指令-01

    目录 路飞项目 vue vue 导读 vue 的优势 渐进式框架 引入 vue 实例成员 - 挂载点 el js 对象(字典)补充 实例成员 - 数据 data 实例成员 - 过滤器 filters ...

  7. VUE-挂载点-实例成员-数据-过滤器-文本指令-事件指令-属性指令-表单指令-01

    目录 路飞项目 vue vue 导读 vue 的优势 渐进式框架 引入 vue 实例成员 - 挂载点 el js 对象(字典)补充 实例成员 - 数据 data 实例成员 - 过滤器 filters ...

  8. Vue框架:挂载点-过滤器-事件指令-表单指令

    近期学习安排 1.Vue框架 前台html+css+js框架,是不同于js与JQuery的数据驱动框架, 学习的知识点:指令 |  实例成员 | vue项目 2.drf框架 django的插件,完成前 ...

  9. [Vue入门及介绍，基础使用、MVVM架构、插值表达式、文本指令、事件指令]

    [Vue入门及介绍,基础使用.MVVM架构.插值表达式.文本指令.事件指令] 1)定义:javascript渐进式框架 ​ 渐进式:可以控制一个页面的一个标签,也可以控制一系列标签,也可以控制整个页面 ...

  10. AngularJs ng-change事件/指令(转)

    from:http://blog.csdn.net/u011127019/article/details/52564111 定义和用法 ng-change 指令用于告诉 AngularJS 在 HTM ...

随机推荐

  1. SwiftUI 官方教程

    SwiftUI 官方教程 完整中文教程及代码请查看 https://github.com/WillieWangWei/SwiftUI-Tutorials   SwiftUI 官方教程 SwiftUI ...

  2. Android 低功耗蓝牙的多设备连接与数据接收，简单实现

    在网络层,互联网提供所有应用程序都要使用的两种类型的服务,尽管目前理解这些服务的细节并不重要,但在所有TCP/IP概述中,都不能忽略他们: 无连接分组交付服务(Connectionless Packe ...

  3. WinForm导出DataSet到Excel

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...

  4. DB2大数据量优化查询解决方案

    利用DB2表分区的功能对大数据量的表进行分区,可以优化查询. 表分区介绍: 表分区是一种数据组织方案,它根据一列或多列中的值把表数据划分为多个称为数据分区 的存储对象. (我觉得表分区就类似于Wind ...

  5. 关于React-native的介绍以及环境搭建

    React-Native介绍(后面内容的RN就是指react-native) 由facebook公司推出的,基于react,能开发原生app 原理: 1. 利用react框架写好js代码 2. 利用p ...

  6. Java基础2一基础语法

    1.标识符 定义:在Java中给类名.方法名.包名,参数名等命名时使用的字符序列即标识符 规则: 由字母.数字.下划线和$符组成 不能以数字开头 长度无限制 严格区分大小写 不能是java中的保留关键 ...

  7. css3伸缩布局中justify-content详解

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

  8. 关于出现Failed to instantiate SLF4J LoggerFactory问题原因，解决办法

    在创建spring boot 文档进行配置的时候,因为使用spring boot 父级依赖的版本 <artifactId>spring-boot-starter-parent</ar ...

  9. Spring AOP理解

    Spring的核心思想的IOC和AOP.最近学习AOP,对切面的学习有了进一步的认识. Spring用代理类包裹切面,把他们织入到Spring管理的bean中.也就是说代理类伪装成目标类,它会截取对目 ...

  10. opengl渲染时画面抖动

    渲一个大尺寸模型的时候模型的细节部分一直在闪烁.尝试: 1. 纹理用mipmap,失败. 2. 开启msaa,失败. 3. 相机近时不闪,越远闪的越厉害,怀疑是深度争夺,就把远裁剪平面调大,失败. - ...