AngularJs的directive指令的link属性详解

在AngularJs中不能直接使用JQuery去选择dom元素,它在指令directive中提供了link属性来让开发者操作dom,具体代码如下:

01
02"en">
03<head>
04    "UTF-8">
05    Document
06head>
07"app">
08    "赵一鸣AngularJs学习笔记" fontsize="30px" fontcolor="#f00">
09
10
11type="text/javascript" src="http://www.zymseo.com/js/demo.js">
12type="text/javascript" src="http://www.zymseo.com/js/angular.min.js">
13type="text/javascript">
14    var m = angular.module('app', []);
15    m.directive('zymBlog', [function(){
16        return {
17            restrict : 'E',
18            scope : {
19                'title' '@title',
20                'fontsize' '@fontsize',
21                'fontcolor' '@fontcolor'
22            },
23            link : function(scope, element, attr){
24                console.log(scope);
25                console.log(attr);
26                //$(element).text(scope.title).css({'color': scope.fontcolor, 'fontSize': scope.fontsize});
27                $(element).text(attr.title).css({'color': attr.fontcolor, 'fontSize': attr.fontsize});
28            }
29        }
30    }]);
31

link属性中,注释的那部分与没有注释的那部分,最后在浏览器中实现的效果是一样的!


本文来自互联网用户投稿,文章观点仅代表作者本人,不代表本站立场,不承担相关法律责任。如若转载,请注明出处。 如若内容造成侵权/违法违规/事实不符,请点击【内容举报】进行投诉反馈!

相关文章

立即
投稿

微信公众账号

微信扫一扫加关注

返回
顶部