angularJs 指令的用法
<!DOCTYPE html>
<html ng-app='app'>
<!--
A attribute属性：当做属性来使用
<div xingoo></div>
E element元素：当做标签元素来使用
<xingoo></xingoo>
C class类：当做CSS样式来使用
<div class="xingoo"></div>
M comments注释：当做注释使用（这种方式在1.2版本下亲测不可用！）
-->
<head>
<meta charset="utf-8">
<title translate="TITLE">Basic usage</title>
<style>body { text-align: center; }</style>
</head>
<body ng-controller="ctrl">
<hello></hello>
<label>{{name}}</label>
<input type="text" set-Focus="">
<script type="text/javascript" src="../script/angular.js"></script>
<script type="text/javascript">
var myApp = angular.module('app',[]);
myApp.controller('ctrl', ['$scope', function($scope) {
$scope.name = "姓名";
}]);
myApp.directive('setFocus', function(){
return {
restrict: 'A',//A 表示attribute属性
link: function(scope, element){
element[0].focus();
}
};
});
myApp.directive('hello', function() {
return {
restrict: 'E', //E 表示 element元素
template: '<div>Hi there</div>',
replace: true
};
});
</script>
</body>
</html>
angularJs 指令的用法的更多相关文章
- angularjs 指令—— 绑定策略（@、=、&）
angularjs 指令—— 绑定策略(@.=.&) 引入主题背景:angular 的指令配置中的template可以直接使用硬编码写相应的代码,不过也可以根据变量,进行动态更新.那么需要用到 ...
- angularjs指令(二)
最近学习了下angularjs指令的相关知识,也参考了前人的一些文章,在此总结下. 欢迎批评指出错误的地方. Angularjs指令定义的API AngularJs的指令定义大致如下 angula ...
- 【转】angularjs指令中的compile与link函数详解
这篇文章主要介绍了angularjs指令中的compile与link函数详解,本文同时诉大家complie,pre-link,post-link的用法与区别等内容,需要的朋友可以参考下 通常大家在 ...
- AngularJS指令进阶 – ngModelController详解
AngularJS指令进阶 – ngModelController详解 在自定义Angular指令时,其中有一个叫做require的字段,这个字段的作用是用于指令之间的相互交流.举个简单的例子,假如我 ...
- angularjs指令中的compile与link函数详解
这篇文章主要介绍了angularjs指令中的compile与link函数详解,本文同时诉大家complie,pre-link,post-link的用法与区别等内容,需要的朋友可以参考下 通常大家在 ...
- AngularJS指令封装高德地图组件
1 概述 公司移动门户原来是基于AngularJS指令封装的百度地图组件,用于签到.签退.定位等功能,在使用过程中发现百度地图频繁的弹出广告,所以打算重新引用其它地图组件,最后决定基于AngularJ ...
- AngularJS中transclude用法详解
这篇文章主要介绍了AngularJS中transclude用法,详细分析了transclude的具体功能.使用技巧与相关注意事项,需要的朋友可以参考下 本文实例讲述了AngularJS中transcl ...
- AngularJS指令
1. AngularJS指令的特点: AngularJS通过被称为指令的新属性来扩展HTML,指令的前缀为ng-. AngularJS通过内置的指令来为应用添加功能. AngularJS允许你自定义指 ...
- angularjs指令参数transclude
angularjs指令参数transclude transclude翻译为嵌入,和之前看到的vue中的slots作用差不多,目的是将指令元素的子内容嵌入到指令的模板中 定义指令 <div sid ...
随机推荐
- synchronize类锁用父类作为锁能否锁住代码块
如果有一个父类,Demo如下 public class Demo { public void demo1(){ synchronized (Demo.class){ while (true){ Sys ...
- 注解的使用、拦截器使用、AOP切面使用
Java 自定义注解及使用场景 转载: https://www.jianshu.com/p/a7bedc771204 Java自定义注解一般使用场景为:自定义注解+拦截器或者AOP,使用自定义注解来自 ...
- 手写一个线程池，带你学习ThreadPoolExecutor线程池实现原理
摘要:从手写线程池开始,逐步的分析这些代码在Java的线程池中是如何实现的. 本文分享自华为云社区<手写线程池,对照学习ThreadPoolExecutor线程池实现原理!>,作者:小傅哥 ...
- Pandas常用操作 - 删除指定行/指定列
1. 删除指定行 new_df = df.drop(index='行索引') new_df = df.drop('行索引', axis='index') new_df = df.drop('行索引', ...
- 帆软报表（finereport）JS实现长页面锚点定位
在报表的应用需求中,页面过长时,需要页面中实现类似HTML中锚点功能以跳转到相应需要预览模块 1实现思路 在设计器中所做的操作最终都会以HTML形式展现在网页.在这里我们为报表块单元格加上id选择器配 ...
- 降维处理PCA
要理解什么是降维,书上给出了一个很好但是有点抽象的例子. 说,看电视的时候屏幕上有成百上千万的像素点,那么其实每个画面都是一个上千万维度的数据:但是我们在观看的时候大脑自动把电视里面的场景放在我们所能 ...
- Solution -「ExaWizards 2019 C」Snuke and Wizards
\(\mathcal{Description}\) Link. 给定一个长度为 \(n\) 的字符串 \(s\),每个字符上初始有一张卡片.\(q\) 次操作,每次指定 \(s\) 中字符为 ...
- TCP/IP详解 读书笔记：TCP：传输控制协议
TCP的服务 TCP为应用层提供一种面向连接的.可靠的字节流服务. 一个TCP连接中,仅有两方进行彼此通信,所以广播和多播不能用于TCP. TCP通过以下方式提供可靠性: 应用数据被切割为TCP认为最 ...
- Linux-CPU优化之上下文切换
为什么大量进程(通常进程数大于CPU个数)的运行会导致CPU长时间处于等待时间而导致平均负债率过高呢?没有使用CPU且无不可中断的进程,这就涉及到了上下文切换. 巧妙地利用了时间片轮转的方式, CPU ...
- CentOS7防火墙firewall
一.Firewall 1. 从CentOS7开始,默认使用firewall来配置防火墙,没有安装iptables(旧版默认安装). 2. firewall的配置文件是以xml的格式,存储在 /usr/ ...