angular学习笔记(1)

最新推荐文章于 2023-12-04 11:43:38 发布

Lemonade_HH_

最新推荐文章于 2023-12-04 11:43:38 发布

阅读量444

点赞数

文章标签： angular 函数 javascript 对象 app

本文链接：https://blog.csdn.net/Lemonade_HH_/article/details/78277455

版权

angular学习笔记(1)

1.表达式：

（1）表达式特性：

所有的表达式都在其所属的作用域内部执行，并有权访问本地$scope的权限
如果表达式发生了TypeError或者ReferenceError错误不会抛出异常
不允许使用任何流程控制（条件控制，if/else）
可以接受过滤器或者过滤器链。

（2）解析Angular表达式（$parse、$watch）:

$parse

作用：将一个AngularJS表达式转换成一个函数

$watch

作用：用于监听模型变化，当你的模型部分发生变化时它会通知你。

弊端: 太多的$watch会导致性能问题

$scope对象上的$watch方法会给Angular事件循环内的每个$digest调用装配一个脏值检查。如果在表达式上检测到变

化，Angular总是会返回$digest循环。

$watch函数本身接受两个必要参数和一个可选的参数:

watchExpression与listener/callback（必选）和objectEquality（可选）

watchExpression:

watchExpression可以是一个作用域对象的属性，或者是一个函数。在$digest循环中的每个$digest调用都会涉及它。

如果watchExpression是一个字符串，Angular会在$scope上下文中对它求值。如果它是一个函数，那么Angular会认

为它会返回应该被监控的值。

linstener/callback:

作为回调的监听器函数，它只会在watchExpression的当前值与先前值不相等（除了首次运行初始化期间）时调用。

objectEquality:

objectEquality是一个进行比较的布尔值，用来告诉Angular是否检查严格相等。

var unregisterWatch =
  $scope.$watch('newUser.email',
  function(newVal, oldVal) {
  if (newVal === oldVal) return; // 初始化
});

$watch函数会给监听器返回一个注销函数，我们可以调用这个注销函数来取消Angular对当前值的监控。

unregisterWatch();

解析数据：

Js:

angular.module('app',[])
.controller('con1',function($scope,$parse){
  $scope.$watch('text',function(newVal,oldVal,scope){
    if( newVal != oldVal ){
      let parseFun = $parse( newVal );

      $scope.parseValue = parseFun(scope);
    }
  })
});

HTML:

<body ng-app="app">
    <div ng-controller="con1">
      <input type="text" ng-model="text">
      <h2>{{ parseValue }}</h2>
    </div>
</body>

Lemonade_HH_

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
3
评论
angular学习笔记(1)

angular学习笔记(1)1.表达式：（1）表达式特性：所有的表达式都在其所属的作用域内部执行，并有权访问本地$scope的权限如果表达式发生了TypeError或者ReferenceError错误不会抛出异常不允许使用任何流程控制（条件控制，if/else）可以接受过滤器或者过滤器链。（2）解析Angular表达式（$parse、$watch）
复制链接

扫一扫