angularjs1-4 事件指令
<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 事件指令的更多相关文章
- AngularJS1.X学习笔记4-内置事件指令及其他
AngularJS为我们定义了一系列事件指令,方便我们对用户的操作作出响应.甚至他还有一个可选模块提供了触摸事件和手势事件的支持,为移动端开发提供了可能.现在开始学习一下AngularJS的事件指令. ...
- Angular——事件指令
基本介绍 angular的事件指令都是ng-click,ng-blur....的形式,类似于js的事件 基本使用 <!DOCTYPE html> <html lang="e ...
- Vue之挂载点、变量、事件、js对象、文本指令、过滤器、事件指令和属性指令
1.vue导入-挂载点 <!DOCTYPE html> <html lang="zh"> <head> <meta charset=&qu ...
- 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.数据驱动.双向绑定 ...
- Angular使用操作事件指令ng-click传多个参数示例
本文实例讲述了Angular使用操作事件指令ng-click传多个参数功能.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html ng-app="m ...
- 第一章、VUE-挂载点-实例成员-数据-过滤器-文本指令-事件指令-属性指令-表单指令-01
目录 路飞项目 vue vue 导读 vue 的优势 渐进式框架 引入 vue 实例成员 - 挂载点 el js 对象(字典)补充 实例成员 - 数据 data 实例成员 - 过滤器 filters ...
- VUE-挂载点-实例成员-数据-过滤器-文本指令-事件指令-属性指令-表单指令-01
目录 路飞项目 vue vue 导读 vue 的优势 渐进式框架 引入 vue 实例成员 - 挂载点 el js 对象(字典)补充 实例成员 - 数据 data 实例成员 - 过滤器 filters ...
- Vue框架:挂载点-过滤器-事件指令-表单指令
近期学习安排 1.Vue框架 前台html+css+js框架,是不同于js与JQuery的数据驱动框架, 学习的知识点:指令 | 实例成员 | vue项目 2.drf框架 django的插件,完成前 ...
- [Vue入门及介绍，基础使用、MVVM架构、插值表达式、文本指令、事件指令]
[Vue入门及介绍,基础使用.MVVM架构.插值表达式.文本指令.事件指令] 1)定义:javascript渐进式框架 渐进式:可以控制一个页面的一个标签,也可以控制一系列标签,也可以控制整个页面 ...
- AngularJs ng-change事件/指令(转)
from:http://blog.csdn.net/u011127019/article/details/52564111 定义和用法 ng-change 指令用于告诉 AngularJS 在 HTM ...
随机推荐
- python 编写的经纬度坐标转换类
# -*- coding: utf-8 -*- # /** # * 各地图API坐标系统比较与转换; # * WGS84坐标系:即地球坐标系,国际上通用的坐标系.设备一般包含GPS芯片或者北斗芯片获取 ...
- SpringBoot中拦截器和过滤器的使用
一.拦截器 三种方式 继承WebMvcConfigurerAdapter spring5.0 以弃用,不推荐 实现WebMvcConfigurer 推荐 继承WebMvcConfiguratio ...
- POJ 1200 Hash
我的hash从来没写对过........ (白学了快一年OI --原来连个hash都没写对过) 但是 但是 今天是一个值得纪念的日子. 看看标题 我竟然在写hash的题解. (好了好了 废话少说) 题 ...
- vue开发的项目中遇到的警告，报错，配置项目文件等合集（长期更新）
1. Vue组件里面data()里面没有return时触发错误:Vue components Cannot read property '__ob__' of undefined 这个警告不解决会触发 ...
- Android stroke 边框线 某一边
有时候需要给View加边框线,我们经常是四边一起加,就像这样: <shape xmlns:android="http://schemas.android.com/apk/res/and ...
- Fragment_动态加载
1.新建Fragment的XML布局文件. 2.在activity.xml中添加需要加载Fragment.列如: <?xml version="1.0" encoding=& ...
- 一个openMP编程处理图像的示例
一个openMP编程处理图像的示例: 从硬盘读入两幅图像,对这两幅图像分别提取特征点,特征点匹配,最后将图像与匹配特征点画出来.理解该例子需要一些图像处理的基本知识,我不在此详细介绍.另外,编译该例需 ...
- 小白学习Spark系列六：Spark调参优化
前几节介绍了下常用的函数和常踩的坑以及如何打包程序,现在来说下如何调参优化.当我们开发完一个项目,测试完成后,就要提交到服务器上运行,但运行不稳定,老是抛出如下异常,这就很纳闷了呀,明明测试上没问题, ...
- UGUI实现打字的效果
创建打字特效控制的脚本,将该脚本挂载都含有Text组件的对象上面,通过该脚本控制Text文本框的文字,以打字的效果显示文字. 脚本 using UnityEngine; using System.Co ...
- C++进阶 STL(1) 第一天 [容器，算法，迭代器] string容器 vector容器 deque容器
课程大纲 02实现基本原理 容器,算法,迭代器 教室:容器 人:元素 教室对于楼:容器 序列式容器: 容器元素在容器中的位置是由进入容器的时间和地点来决定 序列式容器 关联式容器: 教室中 按年龄排座 ...