angular $watch
时间: 2023-12-02 21:06:38 浏览: 32
AngularJS中的$watch是一个内置的函数,用于监视数据模型中的变化,并在变化时执行相应的操作。$watch接受两个参数:要监视的变量和当变量发生变化时要执行的回调函数。$watch函数还可以接受一个可选的第三个参数,用于指定是否深度监视对象或数组中的属性。
例如,以下代码将监视$scope中的myVar变量,并在其值发生变化时将其打印到控制台:
```
$scope.$watch('myVar', function(newValue, oldValue) {
console.log('myVar changed:', newValue);
});
```
相关问题
angular $digest
在AngularJS中,$digest是一个循环机制,用于检查和更新作用域中的所有绑定。它会遍历作用域树,并检查每个作用域中的所有watcher。当检测到一个watcher的值发生变化时,$digest会触发这些watcher的回调函数,从而更新相应的视图。
$digest循环由AngularJS自动触发,不需要手动调用。当AngularJS检测到可能发生变化的事件(例如用户输入、HTTP请求的响应等)时,它会自动启动$digest循环。在这个过程中,AngularJS会检查每个作用域中的watcher,并更新视图以反映最新的模型状态。
然而,有时候我们需要在AngularJS上下文之外修改模型,并希望通知AngularJS进行更新。这时就可以使用$apply方法。$apply方法会触发$digest循环,强制AngularJS检查和更新所有作用域中的watcher。
一种常见的使用场景是在使用第三方库或原生JS代码时,需要手动调用$apply方法来通知AngularJS进行更新。在这种情况下,我们可以将修改模型的代码包裹在$apply函数中,以确保AngularJS能够正确地检测到变化并更新相应的视图。
总结起来,$digest是AngularJS自动触发的循环机制,用于检查和更新作用域中的所有绑定。而$apply是手动调用的方法,用于通知AngularJS在AngularJS上下文之外的代码中发生了模型的变化,需要进行更新。
:https://www.jb51.net/article/120399.htm
:https://stackoverflow.com/questions/41285152/when-to-call-scope-apply-in-angularjs
angular $inject远离
在 AngularJS 中,使用 $injector 服务来注入依赖项时,我们可以使用 $inject 属性来指定被注入的依赖项。$inject 属性是一个数组,其中包含了需要注入的依赖项的名称。
例如,我们要在一个名为 myController 的控制器中注入 $scope 和 $http 服务,可以按照以下方式定义该控制器:
```javascript
angular.module('myModule', [])
.controller('myController', function($scope, $http) {
// 使用 $scope 和 $http 服务
});
```
在上面的代码中,我们使用一个匿名函数来定义 myController 控制器,并在函数的参数列表中指定了需要注入的 $scope 和 $http 服务。
但是,当我们使用 JavaScript 压缩工具来压缩代码时,由于压缩工具会将参数名称进行改变,就可能会导致依赖项不能正确地被注入。为了避免这种情况,我们可以使用 $inject 属性来指定依赖项的名称,如下所示:
```javascript
angular.module('myModule', [])
.controller('myController', ['$scope', '$http', function($scope, $http) {
// 使用 $scope 和 $http 服务
}]);
```
在上面的代码中,我们在使用匿名函数来定义 myController 控制器时,使用了一个数组来定义 $inject 属性,并将需要注入的依赖项的名称作为数组元素进行了指定。这样,在代码被压缩时,依赖项的名称不会被改变,依赖项也能够正确地被注入。
需要注意的是,$inject 属性只有在使用 JavaScript 压缩工具时才需要使用,如果不使用压缩工具,可以直接按照第一个示例中的方式来定义控制器。