如何在AngularJS中等待状态更改

How to wait for state change in AngularJS?

本文关键字：等待状态 AngularJS      更新时间：2024-03-21

使用Angular 1.2.3，我有一个这样的服务：

var itemService = function ($resource) {
    return $resource('/rest/item', {action: ''}, {
        query: {method: 'GET'}
    });
};
services.factory('Item', ['$resource', itemService]);

在我的控制器中，我想保存一个项目，所以我做

$scope.item = Item.query(); // this returns 1 item
$scope.puppet.$save(); // this results in the desired POST on my service

POST处理程序生成一个可能需要一段时间的图像。我知道$save调用会立即返回，因为该调用是异步的。POST处理程序一完成，就会返回一个具有布尔计算值done=true的Item，这反映在$scope中。

<div ng-show="item.calculationsDone"><img ng-src="{{src/of/image.jpg}}"/></div>

现在我想显示生成的图像。我正在使用上面的html。我已经知道生成的图像的URL，但我不能把它放在ng-src中，因为它还没有解析。

一旦Item的状态发生变化，我如何更新或重新应用ng-src？

我需要用承诺吗？还是$watch？

这样的东西怎么样？

$scope.imageSrc = "";
scope.puppet.$save(function(value, responseHeaders) {
 $scope.imageSrc = "src/of/image.jpg";
})
<img ng-src="{{imageSrc}}"/>

我想另一个选项是图像元素的ng-if="item.caculationsDone"。一旦表达式求值为true，img元素就会附加到DOM。在此之前，它不是DOM的一部分->图像也不会被加载。

相关文章：