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 ...
随机推荐
- IOS tableView 滑动删除与排序功能
// // ViewController.m // 0429 // // Created by apple on 15/4/29. // Copyright (c) 2015年 gense. All ...
- App弱网测试方式
硬件设备:网络损伤仪 网络损伤模拟仪的状况包括真实广域网中存在的:有限的带宽.时延.丢包.抖动.乱序.重复报文.竞争流量.拥塞.误码等等.这些状况对网络应用来说可能会降低应用的性能,甚至有时是致命的. ...
- 读源码【读mybatis的源码的思路】
✿ 需要掌握的编译器知识 ★ 编译器为eclipse为例子 调试准备工作(步骤:Window -> Show View ->...): □ 打开调试断点Breakpoint: □ 打开变量 ...
- Solution -「UOJ #450」复读机
\(\mathcal{Description}\) Link. 求从 \(m\) 种颜色,每种颜色无限多的小球里选 \(n\) 个构成排列,使得每种颜色出现次数为 \(d\) 的倍数的排列方案 ...
- 记一次 .NET 某供应链WEB网站 CPU 爆高事故分析
一:背景 1. 讲故事 年前有位朋友加微信求助,说他的程序出现了偶发性CPU爆高,寻求如何解决,截图如下: 我建议朋友用 procdump 在 cpu 高的时候连抓两个dump,这样分析起来比较稳健, ...
- node / npm安装、启动报错
1. 系统禁止运行脚本 a. 在系统中找到Windos PowerShell[可以按win健,然后搜powershell]--以管理员身份打开 b. 在打开的窗口输入set-ExecutionPoli ...
- Docker 设置国内镜像源
创建或修改 /etc/docker/daemon.json 文件,修改为如下形式 # vi /etc/docker/daemon.json { "registry- ...
- WEB服务蜜罐部署实验
实验目的 了解WEB蜜罐的基本原理,掌握Trap Server的使用. 实验原理 Trap Server是一款WEB服务器蜜罐软件,它可以模拟很多不同的服务器,例如Apache. HTTP Serve ...
- Dell服务器配置RAID1+RAID0磁盘阵列
有台DELL R730的服务器,需要部署下公司的程序,这里记录下raid配置. 环境要求 两块硬盘做raid 1 一块硬盘做raid 0 服务器开机,开始配置raid 服务器开机,在出现下图提示时,同 ...
- centos网络配置、虚拟机克隆
查看网卡命令: ifconfig 查看网络配置 ifconfig -a 查看隐藏网卡 window下使用ipconfig 网络配置 设置静态IP,修改/etc/sysconfig/network-sc ...