第六章 表达式

　　前面使用的{{ }}符号将一个变量绑定到$scope上的本质就是一个表达式。

　　表达式和eval（）很相似，但有以下不同特性：

  • 所有表达式都在其所属作用域内部执行，并有访问本地$scope的权限
  • 不会抛出异常
  • 不允许有流程控制功能（if/else）
  • 可以接受过滤器和过滤器链

解析AngularJS表达式

　　尽管AngularJS会自动解析表达式，但有时也可以手动解析。AngularJS通过$pars这个内部服务来进行表达式运算。代码如下：

　　

<!doctype html>
<html>

    <head>
        <script src="angularJs/1.2.13/angular.js"></script>
    </head>

    <body ng-app="myApp">
        <div ng-controller="MyController">
            <input ng-model="expr" type="text" placeholder="Enter an expression" />
            <h2>{{ parseValue }}</h2>
        </div>

    </body>
    <script>
        angular.module("myApp", [])
            .controller('MyController',
                function($scope, $parse) {
                    $scope.$watch('expr', function(newVal, oldVal, scope) {
                        if (newVal !== oldVal) {
                            // 用该表达式设置parseFun 
                            var parseFun = $parse(newVal);
                            // 获取经过解析后表达式的值
                            $scope.parseValue = parseFun(scope);
                        }
                    });
                });
    </script>

</html>

　　上述代码中$watch函数有三个参数：$watch(watchFn, watchAction, deepWatch)

　　　　watchFn:带有AngularJS表达式或函数的字符串，它会返回被监控数据模型的当前值

　　　　watchAction：函数或者表达式，当为函数时，传入三个参数，分别是新值，旧值，作用　　　　　　                                域对象的引用。

　　deepWatch：是否深度监控，当为true时，不仅仅监控对象的简单的值， 也会监控对象　　                         属性的变化。

 　　$watch 函数会返回一个函数，当你不再需要接收变更通知时，可以用这个返回的函数注销监控器。

插值字符串

　　

 

 

 

posted @ 2016-06-26 20:22  且听风吟-wuchao  阅读(200)  评论(0)  编辑  收藏  举报