首页 > 语言 > JavaScript > 正文

angular内置provider之$compileProvider详解

2024-05-06 15:26:11
字体:
来源:转载
供稿:网友

一、方法概览

1.directive(name, directiveFactory)

2.component(name, options)

3.aHrefSanitizationWhitelist([regexp]);

4.imgSrcSanitizationWhitelist([regexp]);

5.debugInfoEnabled([enabled]);

6.strictComponentBindingsEnabled([enabled]);

7.onChangesTtl(limit);

8.commentDirectivesEnabled(enabled);

9.cssClassDirectivesEnabled(enabled);

二、方法解释

1、directive(name, directiveFactory)

使用compiler注册一个指令

参数:

name:string,指令的名称。

directiveFactory:function,指令构造工厂函数。

return:

返回自身,以供链式调用。

2、component(name, options)

使用compiler注册一个组件,组件是一种特殊的指令,它自包含了UI,并且总是默认使用独立作用域和restrict: 'E'。组件的定义是简单的,options是一个包含了一系列属性的对象,并且总是强制使用最好的实践,例如controllerAS:$ctrl。

参数:

name:组件的名称。

options:一个对象,包含以下可选的属性。

controller:string|function,指令的控制器,字符串代表一个被注入到该模块的控制器的名称。

controllerAS:string,控制器的一个引用,默认是'$ctrl‘,如果被定义则scope上会有一个该名称的属性,例如scope.$ctrl,那么我们在html中就可以这样使用控制器中的属性,例如<div>{{$ctrl.name}}<div>

template:string|function,组件的模板,如果是函数,则函数有以下两个参数,

$element:当前元素。

$attrs:当前元素属性对象。

templateUrl:string|function,组件模板的路径,如果是函数,则参数和以上template相同。

bindings:一个对象,用于元素的属性和组件属性之间的绑定,并且绑定的值总是绑定到组件的控制器上而不是scope上,详情请查阅bingToController。

transclude:boolean,是否允许嵌入内容,默认false。

require:一个对象,需要其他指令的控制器被绑定到组件的控制器,对象的键指向属性名称,对象的值是其他指令控制器的名称。

$...:额外的属性被添加到指令工厂函数和控制器构造器函数。(这被使用于为组件路由提供注解)

return:

返回自身,用于链式调用。

3、aHrefSanitizationWhitelist([regexp])

恢复或者覆盖白名单urls安全列表的正则表达式,主要用于阻止通过html链接进行的xss攻击。任何将要通过数据绑定到a[href]的urls首先都要经过初始化并转化为一个绝对url,如果这个url匹配aHrefSanitizationWhitelist的正则表达式规则,则会被添加到DOM中,否则转化后的url将会加上'unsafe:‘前缀后才能被加入到DOM中。

参数:

regexp:RegExp,新的白名单正则表达式。

return:

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表

图片精选