angular 绑定自定义属性_angular的自定义属性

app.directive('myBtn', [function(){

// 在这里直接return 一个对象就可以了

return {

// template属性，是封装的ui

// template:'

我是按钮

',

// A.作用也是提供字符串，对应的内容会被添加到自定义指令所在位置

// 值是一个html文件所在位置

// B. 值也可以是一个script标签的id

// templateUrl:'./01.template.html'

templateUrl:'tpl',

restrict:'ECA', // Attribute Class Element

// 取代，替换

// replace: true, // 为true时，会把模板中的内容替换到自定义上。

// 为true时会把自定义标签中间的内容，插入到指定的模板中

transclude: true,

// 可以得到自定义指令的属性

scope:{

// @开头，表示要获取自定义指令属性的值,

// 在对应的模板可以直接使用{{tmp}} 来得到mystyle对应的值

// tmp:'@mystyle'

mystyle:'@' // 这是上一行的简写

},

// 指定一个function

link:function(scope,element,attributes){

// 参数:

// scope: 类似于控制器时里的$scope,但是这里的scope属性值是在模板中使用的.

scope.msg="我是中国人，我爱自己的祖国!"

// element ： 指向模板最外层的对象

// 如果replace为true,指向的就是自定义指令所在标签

console.log(element)

element.on('click',function(){

alert('你点我了!')

})

// attributes : 这个对象里的属性就是自定义指令所在标签的属性

console.log(attributes)

// angular.element

console.log('link')

}

}

}])