观察 AngularJS 可观察量
Observing AngularJS observables
使用AngularJS,我应该如何触发模型现在很脏,需要保存到服务器?除了用户点击"保存"按钮?
我想过使用$watch,但是当数据首次加载时,该东西会触发,因此您最终会到处都是这个黑客:
在 AngularJS 中观察模型变化时如何忽略初始负载?
您还可以$emit事件以触发保存,但在以下情况下:
- 在作用域上设置属性
- $emit该范围内的事件
- 在父控制器中使用$on捕获事件并查看属性
按照该顺序,在步骤 3 中声明的事件处理程序将看到在步骤 1 中进行更改之前一样的 scope 属性。
我在这里举了一个例子:
http://plnkr.co/edit/Il9TzUdCSBdewCxIKARZ
如果依次单击"foo"、"bar"、"foo"、"bar",则会看到事件侦听器始终落后于属性一步。
我假设这与何时处理与摘要周期相关的范围事件有关,但它似乎确实违反了 javascript 的定律。Angular 的家伙是如何设法做到的,所以当你改变它时属性不会改变!?
当我总是保存旧数据时,这让我有些头疼。
快速解决方法是使用$timeout来"延迟"保存,我假设直到摘要周期结束。虽然这有效,但它似乎很混乱。这是怎么回事?如果对范围的更改对事件处理程序不可见,则事件似乎毫无用处,不是吗?
有没有一种干净的方法可以做到这一点?
谢谢。
这是因为双向绑定在$digest
循环之前不会更新,这发生在$emit
之后。
我建议对数据使用$watch
来触发保存。
// Controller
$scope.$watch('message', function(newVal, oldVal) {
if (newVal === oldVal) {
return;
}
// Handle update...
});
另一种选择是将对象而不是字符串传递到指令中。 通过这样做,$on
侦听器将可以访问正确的数据。
例如:
// Controller
$scope.messageData = {message: "Initial message"};
// HTML
<div set-message="messageData">...</div>
// Directive
scope: {
messageData: "=setMessage"
},
link: function(scope) {
scope.setMessage = function(message) {
scope.messageData.message = message;
scope.$emit('messagechange');
};
}
相关文章:
- AngularJS:使用$scope$以控制器作为语法进行观察
- 用于观察高度变化的AngularJS指令
- Angularjs - 观察模态窗口从另一个控制器关闭
- Angularjs 中的可观察量
- AngularJS:观察数组属性
- AngularJS观察指令属性表达式,动态继承作用域
- Angularjs观察用户在输入文本中键入逗号的情况
- 使用AngularJS观察整个对象(深度观察)
- 在jQuery数据表中使用AngularJS观察者的方法是什么
- angularjs如何为函数设置观察程序
- AngularJS:在没有$watch的情况下观察变量
- 观察元素位置并对 AngularJS 中的更改做出反应
- Knockout的可写计算在AngularJS中可观察的模拟是什么?
- 如何观察 DOM 的变化 AngularJS
- 如何在 angularjs 中观察对象中的对象
- Angularjs - $scope.$destroy 不会删除观察者
- 如何在 angularjs 服务中包装对象(并观察此对象的更改)
- AngularJS:观察身高变化的更好方法
- 观察 AngularJS 可观察量
- 观察AngularJS服务中数组的变化