AngularJs-在一个$watch函数中有多个应用/摘要周期
AngularJs - Multiple apply / digest cycles in one $watch function
我想知道如何在$watch
表达式中触发第二个摘要循环。似乎在$watch
表达中只有一个消化周期是可能的。我试图调用$apply
,但它崩溃了,并显示消息"摘要已在进行中"。
function TestCtrl($scope) {
var purchase_orders = [
{id : 1, name : 'Purchase Order One', multiple_day_rates : true },
{id : 2, name : 'Purchase Order Two', multiple_day_rates : false },
{id : 3, name : 'Purchase Order Three', multiple_day_rates : true } ];
$scope.purchase_orders = purchase_orders;
$scope.$watch(
"poId",
function( poId ) {
console.log("watch triggered for po id");
$scope.multiple_day_rates = null; //seems to have no effect..
//$scope.$apply(function () {
// $scope.multiple_day_rates = null;
// }); --> throws digest already in progress
var purchase_order_obj = jQuery.grep($scope.purchase_orders, function(e){ return e.id == $scope.poId; });
if(typeof purchase_order_obj[0] != 'undefined'){
if(purchase_order_obj[0].multiple_day_rates == true){
console.log("before setting multiple day rates to true");
$scope.multiple_day_rates = true;
}
else{
console.log("before setting multiple day rates to false");
$scope.multiple_day_rates = false;
$scope.day_rate_check=true;
}
}
}
);
$scope.$watch(
"multiple_day_rates",
function( multiple_day_rates ) {
console.log("watch triggered for multiple day rates");
}
);
}
我的目标是,当设置了$scope.multiple_day_rates
时,我想运行一些代码。我还想检测它何时从true
设置为true
。由于AngularJS正在进行某种脏检查(只有当值发生变化时才会触发监视),我必须在之前将$scope.multiple_day_rates
设置为null,以便检测到变化。但不知何故,在$watch
表达中,似乎只有一个消化周期是可能的。这是JSFiddle。您可以看到,当选择从"采购订单一"更改为"采购订单二"时,什么都不会发生,因为multiple_day_rates
在两个时间点都是true
。
这就是您想要实现的目标吗?
function TestCtrl($scope, $timeout) {
var purchase_orders = [{
id: 1,
name: 'Purchase Order One',
multiple_day_rates: true
}, {
id: 2,
name: 'Purchase Order Two',
multiple_day_rates: false
}, {
id: 3,
name: 'Purchase Order Three',
multiple_day_rates: true
}];
$scope.purchase_orders = purchase_orders;
$scope.$watch(
"poId",
function (poId) {
console.log("watch triggered for po id");
$scope.multiple_day_rates = null; //seems to have no effect..
//$scope.$apply(function () {
// $scope.multiple_day_rates = null;
// }); --> throws digest already in progress
$timeout(function () {
var purchase_order_obj = jQuery.grep($scope.purchase_orders, function (e) {
return e.id == $scope.poId;
});
if (typeof purchase_order_obj[0] != 'undefined') {
if (purchase_order_obj[0].multiple_day_rates == true) {
console.log("before setting multiple day rates to true");
$scope.multiple_day_rates = true;
} else {
console.log("before setting multiple day rates to false");
$scope.multiple_day_rates = false;
$scope.day_rate_check = true;
}
}
});
}
);
$scope.$watch(
"multiple_day_rates",
function (multiple_day_rates) {
console.log("watch triggered for multiple day rates");
}
);
}
http://jsfiddle.net/qhnr5/
相关文章:
- 如何将HTML id分配给元素,以及如何将JavaScript应用于元素
- Canvas Html5绘图应用程序,移动画布会导致重大问题
- Emberjs应用程序加载在除Index之外的所有路由上
- 使用电话间隙在Android应用程序中显示SQL Lite的数据
- 跟踪在页面加载时应用内联样式的JavaScript
- 在AngularJS应用程序中使用封装指令和路由的推荐方式是什么
- 如果文本字段为空,则使用JavaScript应用CSS样式
- Windows8应用程序(html&Javascript):从图片库(除了文件选择器)显示图像的另一种方式
- 为什么在单独的函数中应用时转换会闪烁/断断续续(D3)
- angular 1.5应用程序中的导航栏
- 在Web应用程序中使用Highcharts javascript
- angularjs+rails应用程序中未显示模板
- 从html创建一个指令,该指令按类名应用函数
- 使用acess代币登录Facebook,并通过网络应用程序离线发布
- 管理动态磁贴和应用程序生命周期
- AngularJs-在一个$watch函数中有多个应用/摘要周期
- 如何使用AngularJS来存储'Token'在应用程序的生命周期内
- BackboneJs:在应用程序的整个生命周期中使用部分获取而不是 1 个集合
- Windows UWP应用生命周期:如何防止JS/HTML/CSS应用中的重载
- 在Chrome原生消息传递:有多长是本地应用实例对象的生命周期