$parse ， $interpolate ，$complie , $destroy

时间：2023-03-09 16:03:38
$parse ， $interpolate ，$complie , $destroy

$parse 是angular 提供的javascript解析器 .

var getter = $parse(expression);

var setter = getter.assign;

                    controller("ctrl", ["$scope", "$parse", "$compile", "$interpolate", function ($scope, $parse, $compile, $interpolate) {
                        //read

                        $scope.name = "hello";

                        var expression = "name + ' ' +((5+6) == (12-1))";

                        var getter = $parse(expression);

                        var value = getter($scope); //hello true   
                        //write
                        expression = "name";
　　　　　　　　　　　　　  var setter = getter.assign;
                        setter($scope, "1782");    
                        $scope.name; //1782

                    }]);

有点像javascript eval 和 with 的结合。内部是通过复杂的正则实现的。

$parse 无法解析angular 的 {{}} 符合。

所以当我们需要解析如 {{name}} 时， 我们会用 $interpolate

                        $scope.name = "hello";

                        var expression = "{{name}}";

                        var value = $interpolate(expression)($scope); //没有setter的方法哦

                        console.log(value);

$compile 是用来处理html 节点的 . 要注意的是 $compile('str')($scope) = node; 这个node要在digest之后才会有scope value, ng-repeat同理，没有digest连一行都看不见，只有comment记号。

                        $scope.name = "hello"

                        var link = $compile("<div>{{name}}</div>");

                        var node = link($scope);

                        console.log(node[0].innerHTML); //{{name}} <--还没同步值

                        setTimeout(function () {

                            console.log(node[0].innerHTML); //hello <--同步咯

                        }, 0); //推迟到$digest之后

$compile 要注意的事 :

var elemA = $compile(directiveA)(scopeA);

1.elemA 的 scope 一定是scopeA , 即使directiveA使用了隔离scope.(elemA的child才是隔离的scope)

2.如果 directiveA 内有require, 那是不对的，会报错, 指令有require 那么它必须和它的依赖指令一起compile

3.$compile 不依赖elem的格局， 它只在乎scope, 所以elemA 你可以append到任意的地方,scope改变view依然会改变

4.scope 属于模板，所以你compile的这个scope应该是只属于这个模板的，当模板被remove,你的scope理应一同被remove.

5.template 不能被 compile 超过一次，同理 scope 也是一样 (不要想着一个scope compile 多个模板 , 记得 scope 属于模板而不是控制器 !)

6.remove 或 html('') 删除模板时, 记得调用 $elem.scope().$destroy(); scope一样删除.

7. 一般上只有在做动态模板的时候我们才会自己调用 $compile, 大部分情况下我们还是简单实用指令，模板，控制器就好 ^^

其实在angualr中最好是用 $timeout(fn,time,need_digest). 第3个参数让我们觉得之后要不要digest多一次.

随机推荐

  1. delphi7开发webservice部属在apache服务器中 转

    delphi7开发webservice部属在apache服务器中 delphi7 webservice apache 用Delphi7开发Web Service程序,并把服务程序放在apache We ...

  2. [LeetCode] 147. Insertion Sort List 解题思路

    Sort a linked list using insertion sort. 问题:实现单向链表的插入排序. 这是比较常规的一个算法题目. 从左往右扫列表,每次将指针的下一个元素插入前面已排好序的 ...

  3. 介绍一款超实用的演讲必备工具 ZoomIt

    最近在整理以前的文件时,发现躺在某个角落的一个超好的实用的小工具——ZoomIt.此工具是 SysinternalsSuite(已被MS收购)众多实用工具的一个. 相信大家在演讲时,经常需要调整屏幕文 ...

  4. URAL 1244

    题目大意:给出一个正整数M,给出N个正整数ai,让你在这些数中挑出一些数组成M的一个划分,如果符合条件的划分数超过两个,输出:-1,如果没有输出:0,如果有且仅有一个:则按顺序输出剩下的数的序号. 例 ...

  5. Java组合与继承生成的类中构造函数的执行顺序

    [程序实例] import java.util.*; class Meal{ Meal() { System.out.println("Meal Constructor"); } ...

  6. Java体系总结

    一.Java SE部分 1.java基础:基础语法:面向对象(重点):集合框架(重点):常见类库API: 2.java界面编程:AWT:事件机制:Swing: 3.java高级知识:Annotatio ...

  7. Android中Context具体解释 ---- 你所不知道的Context

                                                                                                         ...

  8. Python序列的方法（转）

    在快速教程中,我们了解了最基本的序列(sequence).回忆一下,序列包含有定值表(tuple)和表(list).此外,字符串(string)是一种特殊的定值表.表的元素可以更改,定值表一旦建立,其 ...

  9. 监听tableview的点击事件

    // 监听tablview的点击事件 - (void)addAGesutreRecognizerForYourView { UITapGestureRecognizer *tapGesture = [ ...

  10. Spring 详解第一天

    spring 框架简述: http://www.cnblogs.com/ToBeAProgrammer/p/5230065.html http://www.cnblogs.com/ToBeAProgr ...

相关文章