$ parse,$ interpolate和$ compile服务有什么区别？

Question

是什么区别$parse,$interpolate和$compile服务？对我来说,他们都做同样的事情:拿模板并将其编译为模板函数.

Answer 1

这些都是有助于AngularJS查看渲染(尽管服务的所有实例$parse和 $interpolate该领域之外也可以使用).为了说明每个服务的作用,我们以这个HTML为例:

var imgHtml = '<img ng-src="/path/{{name}}.{{extension}}">'

和范围上的值:

$scope.name = 'image';
$scope.extension = 'jpg';

鉴于此标记,这是每个服务带来的表:

• $compile- 它可以采用整个标记并将其转换为链接函数,当针对特定范围执行时,将把一段HTML文本转换为动态的实时DOM,其中所有指令(此处ng-src:)对模型更改做出反应.可以按如下方式调用它:$ compile(imgHtml)($ scope)并获得一个带有所有DOM事件边界的DOM元素.$compile正在利用$interpolate(除其他事项外)来完成其工作.
• $interpolate知道如何使用嵌入的插值表达式处理字符串,例如:/path/{{name}}.{{extension}}.换句话说,它可以采用带有插值表达式的字符串,范围并将其转换为结果文本.人们可以将$interpolation服务视为一种非常简单的基于字符串的模板语言.鉴于以上示例,我将使用此服务:$interpolate("/path/{{name}}.{{extension}}")($scope)以获取path/image.jpg字符串作为结果.
• $parse用于$interpolate评估范围内的单个表达式(name,extension).它可用于读取和设置给定表达式的值.例如,要评估name表达式,可以:$parse('name')($scope)获取"图像"值.设置值可以:$parse('name').assign($scope, 'image2')

所有这些服务都在一起工作,以在AngularJS中提供实时UI.但它们在不同层面上运作:

• $parse只涉及个别表达(name,extension).它是一种读写服务.
• $interpolate是只读的,并涉及包含多个表达式的字符串(/path/{{name}}.{{extension}})
• $compile 是AngularJS机器的核心,可以将HTML字符串(带有指令和插值表达式)转换为实时DOM.