angularJS自定义指令scope代替link
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body ng-app="scope">
<hello></hello>
<div ng-controller="h1">
<input type="text" ng-model="hh"/>
<hello1 attr1="hh"></hello1>
</div>
<hr/>
<div ng-controller="h2">
<hello2 greet="alertH(name)"></hello2>
<hello2 greet="alertH(name)"></hello2>
<hello2 greet="alertH(name)"></hello2>
</div>
</body>
<script src="angular.js"></script>
<script>
var app=angular.module("scope",[]);
app.directive("hello",function(){
return{
restrict:"AE",
scope:{},
template:"<div><input type='text' ng-model='name'/> {{name}}</div>",
replace:true
}
});
app.controller("h1",function($scope){
$scope.hh="哈哈";
});
app.directive("hello1", function(){
return{
restrict:"AE",
scope:{
//attr1:"@"//单向传递字符串
attr1:"="//双向绑定字符串
},
template:"<input type='text' ng-model='attr1'/><div>{{attr1}}</div>"
}
}); //scope & 用法
app.controller("h2",function($scope){
$scope.alertH=function(name){
alert("hello "+name);
}
});
app.directive("hello2", function(){
return{
restrict:"AE",
scope:{
//attr1:"@"//单向传递字符串
//attr1:"="//双向绑定字符串
greet:"&"//可绑定非字符串
},
template:"<input type='text' ng-model='userName'/><br/>"+
"<input type='button' value='get' ng-click='greet({name:userName})'/><br/>"
}
});
</script>
</html>
angularJS自定义指令scope代替link的更多相关文章
- AngularJS自定义指令directive：scope属性 （转载）
原文地址:http://blog.csdn.net/VitaLemon__/article/details/52213103 一.介绍: 在AngularJS中,除了内置指令如ng-click等,我们 ...
- angularjs自定义指令Directive
今天学习angularjs自定义指令Directive.Directive是一个非常棒的功能.可以实现我们自义的的功能方法. 下面的例子是演示用户在文本框输入的帐号是否为管理员的帐号"Adm ...
- angularJs 自定义指令传值---父级与子级之间的通信
angularJs自定义指令用法我忽略,之前有写过,这里只说一下父子级之间如何传值: 例如: 模块我定义为myApp,index.html定义 <my-html bol-val="bo ...
- AngularJS: 自定义指令与控制器数据交互
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- 浅析AngularJS自定义指令之嵌入(transclude)
AngularJS自定义指令的嵌入功能与vue的插槽十分类似,都可以实现一些自定义内容展现.在开始之前先简单介绍下自定义指令的transclude属性和AngularJS的内置指令ng-transcl ...
- AngularJs自定义指令详解（1） - restrict
下面所有例子都使用angular-1.3.16.下载地址:http://cdn.bootcss.com/angular.js/1.3.16/angular.min.js 既然AngularJs快要发布 ...
- AngularJs自定义指令详解（5） - link
在指令中操作DOM,我们需要link参数,这参数要求声明一个函数,称之为链接函数. 写法: link: function(scope, element, attrs) { // 在这里操作DOM} 如 ...
- AngularJs自定义指令详解（6） - controller、require
在前面文章中提到一旦声明了require,则链接函数具有第四个参数:controller. 可见require和controller是配合使用的. 在自定义指令中使用controller,目的往往是要 ...
- angularJS——自定义指令
主要介绍指令定义的选项配置 //angular指令的定义,myDirective ,使用驼峰命名法 angular.module('myApp', []) .directive('myDirectiv ...
随机推荐
- jQuery对表单、表格的操作及更多应用（中：表格应用）
内容摘录自锋利的JQuery一书 二.表格应用 1 表格隔行变色(:odd和:even选择器 P157) $(function(){ $("tr:odd").addClass(&q ...
- OGRE: "OgreOverlaySystem.h": No such file or directory
这两天学习OGRE,遇到"OgreOverlaySystem.h": No such file or directory的错误. 这是由于OGRE提供的例子过老,和SDK版本不一致 ...
- cocos2d 多点触控
#ifndef __HELLOWORLD_SCENE_H__ #define __HELLOWORLD_SCENE_H__ #include "cocos2d.h" USING_N ...
- ios 开发中出现的 pointer being freed was not allocated *** set a breakpoint in malloc_error_break to debug
主要原因是某部分内存释放的太频繁,解决方法是检查函数的中[xxx release]; 将其注释掉 就行了
- 提升 web 应用程序的性能（二）
最佳实践 本章将略述能帮助您提升 web 应用程序性能的最佳实践. 减少 HTTP 请求数 每个 HTTP 请求都有开销,包括查找 DNS.创建连接及等待响应,因此削减不必要的请求数可减少不必要的开销 ...
- 【C语言】08-数组
为了让大家更好地学习和理解数组,我们先来认识一下内存中的"地址". 地址 1.计算机中的内存是以字节为单位的存储空间.内存的每一个字节都有一个唯一的编号,这个编号就称为地址.凡存放 ...
- iOS开发之--UITextField属性
UITextField属性 0. enablesReturnKeyAutomatically 默认为No,如果设置为Yes,文本框中没有输入任何字符的话,右下角的返回按钮是disabled的. ...
- hdu Knight Moves
这道题实到bfs的题目,很简单,不过搜索的方向变成8个而已,对于不会下象棋的会有点晕. #include <iostream> #include <stdio.h> #incl ...
- 是否允许处理由Zend Encoder加密的PHP文件
Zend Optimizer是由PHP核心引擎"Zend"创建者Zend技术公司所开的免费PHP优化软件.据Zend公司透露使用这个软件某些情况下至少可以提高性能30%以上!Zen ...
- PowerShell监控Windows打印服务器
转自:http://sodaxu.blog.51cto.com/8850288/1417385 #获取日志,事件ID 307即我们需要提取的事件. path后的路径要与operational日志属性里 ...