[英]AngularJs $watchGroup - which expression in the group was last changed?
使用$watchGroup
,如何確定組中的哪個表達式已更改
$scope.$watchGroup(['dec','bin','oct','hex'], function(newValues, oldValues, scope) {
last_changed = ??? //return which exp was changed in this run...
if(last_changed=='dec') //then something
if(last_changed=='bin') //then something
if(last_changed=='oct') //then something
if(last_changed=='hex') //then something
});
編輯1:-
--->問題是我無法將n_vals與newValues解除綁定。
var n_vals = [];
$scope.$watchGroup(['dec','bin','oct','hex'], function(newValues, oldValues, scope) {
last_updated = changed_one(newValues,n_vals); //last_updated EXP
n_vals = newValues;
});
n_vals = angular.copy(newValues);
看下面的鏈接:
深度復制對象成角度嗎?
Angular提供$watchGroup
(從1.3開始) 。
基本上,它以我們將其放入watchGroup
的方式返回范圍變量oldValue
和newValue
。
使用范圍變量的索引來獲取其各自的newVal
和oldVal
如下所示。
要獲取各個范圍變量的newValue
:
newValue[0] // returns new value of dec
newValue[1] // returns new value of bin
newValue[2] // returns new value of oct
newValue[3] // returns new value of hex
要獲取各個范圍變量的oldValue
:
oldValue[0] // returns old value of dec
oldValue[1] // returns old value of bin
oldValue[2] // returns old value of oct
oldValue[3] // returns old value of hex
$scope.$watchGroup(['dec','bin','oct','hex'], function(newValues, oldValues, scope) {
console.log(newValues[index]); //put index value as 0(dec), 1(bin), 2(oct) or 3(hex)
console.log(oldValues[index]); //put index value as 0(dec), 1(bin), 2(oct) or 3(hex)
});
注意:
下面的邏輯考慮到一次只能更改一個值。
編輯1
要捕獲最后更新的變量,可以嘗試以下代碼。
var arrayOfValues = ['dec', 'bin', 'oct', 'hex'];
$scope.$watchGroup(arrayOfValues, function(newValues, oldValues, scope) {
let last_changed;
var chanedIndex = newValues.findIndex(function(val, key){
return val !== oldValues[key];
});
last_changed = arrayOfValues[chanedIndex];
// above logic could simply avoid the below conditional logic (refer
// comment above in front of if condition)
if (angular.isDefined(last_changed)) {
// your logic will come here as per your question
switch(last_changed){
case 'dec':
doSomething();
case 'bin':
doSomething();
case 'oct':
doSomething();
case 'hex':
doSomething();
}
}
});
編輯2:
我縮小了代碼並使
var arrayOfValues = ['dec', 'bin', 'oct', 'hex'];
// generic method which will tell you which variable has been updated
$scope.checkWhichVariableHasUpdated = fucntion(watchGroupList, newValuesObj, oldValuesObj) {
let _lastUpdatedValue;
angular.forEach(watchGroupList, function(value, index) {
if (newValuesObj[index] != oldValuesObj[index])
_lastUpdatedValue = value;
});
return _lastUpdatedValue;
};
$scope.mySwitchFunction = function(changedVariable) {
switch (changedVariable) {
case 'dec':
doSomething();
break;
case 'bin':
doSomething();
break;
case 'oct':
doSomething();
break;
case 'hex':
doSomething();
break;
}
};
$scope.$watchGroup(arrayOfValues, function(newValues, oldValues, scope) {
var last_changed = $scope.checkWhichVariableHasUpdated(arrayOfValues, newValues, oldValues);
if (angular.isDefined(last_changed)) {
$scope.mySwitchFunction(last_changed)
}
});
我希望這可以解決問題。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.