码迷,mamicode.com
首页 > 其他好文 > 详细

自定义

时间:2017-09-16 01:11:55      阅读:245      评论:0      收藏:0      [点我收藏+]

标签:str   turn   return   restrict   template   replace   direct   总结   app   

自定义指令:

<!--元素-->
<my-game></my-game>
<!--Class-->
<div class="my-game"></div>
<!--属性-->
<div my-game></div>
<!--注释-->
<!--directive:my-game -->
app.directive(‘myGame‘,function(){
return{
template:‘<h1>自定义指令</h1>‘,
restrict:‘EACM‘,
replace:true
}
})

自定义指令:
restrict:‘EACM‘
E-->Element 元素
A-->Attribute 属性
C-->Class
M-->Comment 注释(在指令中添加一个属性:replace:true)

新指令的命名:
①驼峰式
②前缀一般是公司或者项目的简写,后缀一般是指令的作用
③使用指令:myGame--->myGame

自定义传参


 

<div my-game="" test-Name="Liang"></div>
<script>
var app = angular.module(‘myApp‘, [‘ng‘]);
app.controller(‘myCtrl‘, function ($scope) {

});
app.directive(‘myGame‘,function(){
return {
template:‘<p>hello{{testName}}</p>‘,
scope:{
testName:‘@‘
}
}


总结:如果要参数的传递,需要在创建指令的时候,加上scope,同时指定对应的属性的名称(testName),在使用指令的时候,需要加上对应的属性(test-name=‘‘)

 

 

自定义

标签:str   turn   return   restrict   template   replace   direct   总结   app   

原文地址:http://www.cnblogs.com/liangfc/p/7529247.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!