在 AngularJS 中观察模型变化时,如何忽略初始负载?

我有一个 Web 页面,用作单个实体的编辑器,该实体作为 $scope.fieldContainer 属性中的深度图形。在从 REST API (通过 $resource)获得响应之后,我将一个 watch 添加到‘ fieldContainer’。我使用这个手表来检测页面/实体是否是“脏的”。现在我让保存按钮弹出,但我真的想让保存按钮不可见,直到用户弄脏了模型。

我得到的是一个单一的触发器的手表,我认为这是发生,因为。FieldContainer = ... 赋值在创建手表之后立即发生。我想用一个“ DirtyCount”属性来吸收最初的假警报,但是感觉非常古怪... ... 我想一定有一个“角度惯用”的方法来处理这个问题——我不是唯一一个用手表来检测脏模型的人。

这是我设表的密码:

 $scope.fieldcontainer = Message.get({id: $scope.entityId },
function(message,headers) {
$scope.$watch('fieldcontainer',
function() {
console.log("model is dirty.");
if ($scope.visibility.saveButton) {
$('#saveMessageButtonRow').effect("bounce", { times:5, direction: 'right' }, 300);
}
}, true);
});

我只是一直在想,一定有比用“ if (dirtyCount > 0)”来保护我的“ UI 脏”代码更干净的方法... ..。

69584 次浏览

在初始加载之前设置一个标志,

var initializing = true

然后当第一个 $watch 点火时,执行

$scope.$watch('fieldcontainer', function() {
if (initializing) {
$timeout(function() { initializing = false; });
} else {
// do whatever you were going to do
}
});

该标志将在当前摘要周期结束时被撕毁,因此下一个更改不会被阻止。

第一次调用侦听器时,旧值和新值将是相同的。那就这么做:

$scope.$watch('fieldcontainer', function(newValue, oldValue) {
if (newValue !== oldValue) {
// do whatever you were going to do
}
});

这实际上是角度记录 建议处理的方式:

在监视器注册到作用域之后,将异步调用侦听器 fn (通过 $evalAsync)来初始化监视器。在极少数情况下,这是不可取的,因为在 watch Expression 的结果没有更改时调用侦听器。要在侦听器 fn 中检测这个场景,可以比较 newVal 和 oldVal。如果这两个值相同(= = =) ,则由于初始化而调用侦听器

我知道这个问题已经得到了解答,但我有一个建议:

$scope.$watch('fieldcontainer', function (new_fieldcontainer, old_fieldcontainer) {
if (typeof old_fieldcontainer === 'undefined') return;


// Other code for handling changed object here.
});

使用标志工程,但有一点 代码的味道到它,你不觉得吗?

只是有效的新 val 的状态:

$scope.$watch('fieldcontainer',function(newVal) {
if(angular.isDefined(newVal)){
//Do something
}
});

在当前值的初始加载期间,旧值字段是未定义的。因此,下面的示例可以帮助您排除初始负载。

$scope.$watch('fieldcontainer',
function(newValue, oldValue) {
if (newValue && oldValue && newValue != oldValue) {
// here what to do
}
}), true;