[英]How do I make a promise resolve as an object in the view?
I'm trying to wrap a third party library to return an object that resolves into an object that can be displayed in the view, similar to how $resource() works. 我正在尝试包装第三方库以返回一个对象,该对象解析为可以在视图中显示的对象,类似于$ resource()的工作方式。 I'm aware that I can manually do .then() on the promise and then set the value, but I wanted the result to seamlessly return similar to how I can do:
我知道我可以在promise上手动执行.then()然后设置值,但是我希望结果能够无缝返回,类似于我可以做到的:
this.Value = $resource("/someresource").get();
How would I change the below SomeThirdPartyFunction() to return an object that resolves in the view. 我将如何更改下面的SomeThirdPartyFunction()以返回在视图中解析的对象。
Here's an example of what I'm trying to do: 这是我要执行的操作的一个示例:
angular.module('testApp', []).controller('TestController', function ($timeout, $q) {
var TestController = this;
var SomeThirdPartyFunction = function () {
var Deferred = $q.defer();
var Promise = Deferred.promise;
$timeout(function () {
Deferred.resolve("abcd");
}, 3000);
return Promise;
};
TestController.Value = SomeThirdPartyFunction();
/* I don't want to do this:
SomeThirdPartyFunction().then(function(Value) {
TestController.Value = Value;
});*/
});
And here's a plunker: https://plnkr.co/edit/HypQMkaqXmFZkvYZXFXf?p=preview 这是一个小矮人: https ://plnkr.co/edit/HypQMkaqXmFZkvYZXFXf ? p = preview
Every example I've seen using promises just wraps $http calls, but I haven't seen any examples of calling third party libraries that return promises that resolve into objects. 我见过的每个使用Promise的示例都只包装$ http调用,但是我没有见过调用第三方库返回可解析为对象的Promise的示例。
From the AngularJS document : 从AngularJS文档中 :
It is important to realize that invoking a $resource object method immediately returns an empty reference (object or array depending on isArray).
重要的是要意识到调用$ resource对象方法会立即返回空引用(对象或数组取决于isArray)。 Once the data is returned from the server the existing reference is populated with the actual data.
从服务器返回数据后,将使用实际数据填充现有引用。
So instead of return a promise, you can do something like this: 因此,您无需执行承诺,而是可以执行以下操作:
var SomeThirdPartyFunction = function() {
var getAComplextObject = function() {
return {
number: 42,
method: function() {
return this.number + 1;
}
};
};
var returnValue = {};
$timeout(function() {
console.log("Resolved!");
Object.assign(returnValue, getAComplextObject());
}, 1000);
return returnValue;
};
You can wrap it in a promise and make the promise part of the return value, doing that you can make it thenable (aka a Promise) 您可以将其包装在promise中并使promise成为返回值的一部分,这样您就可以使其成为可兑现的(也称为Promise)
Under-the-hood, $resource uses angular.copy : 在幕后 , $ resource使用angular.copy :
function myResourceGet(params) {
var emptyObj = {};
emptyObj.$resolved = false;
emptyObj.$promise = $http.get(url, {params:params})
.then(function(response) {
angular.copy(response.data, emptyObj);
}).finally(function() {
emptyObj.$resolved = true;
});
return emptyObj;
}
From the Docs: 从文档中:
angular.copy Overview
angular.copy概述
Creates a deep copy of
source
, which should be an object or an array.创建
source
的深层副本,该副本应该是对象或数组。
- If a destination is provided, all of its elements (for arrays) or properties (for objects) are deleted and then all elements/properties from the source are copied to it.
如果提供了目标,则将删除其所有元素(用于数组)或属性(对于对象),然后将源中的所有元素/属性复制到该目标。
The $resource service only works when the data is an object or an array. $ resource服务仅在数据是对象或数组时有效。 It does not work with primitives such as a string or number.
它不适用于字符串或数字之类的原语。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.