角绑定到承诺的地位？

Question

If I've got a promise from, for example, and HTTP request:

$scope.myHttpPost = $http.post(…);

Is it possible to bind to the status (loading / done / error) in a template?

For example, something like:

<div ng-switch on="myHttpPost.status">
    <span ng-switch-when="'loading'">Loading…</span>
    <span ng-switch-when="'done'">Success!</span>
    <span ng-switch-when="'error'">Error :(</span>
</div>

Answer 1

It doesn't look like you can do this with any built in method. However it isn't that hard to setup a reusable promise wrapping system to get the variables you are looking for. To use the words you wanted in your example, you could do something like:

// function inside service
function newStatus(promise) {
    var status = {
        label: 'loading'
    };

    promise.then(function(){
        status.label = 'done';
    });

    promise.catch(function(){
        status.label = 'error';
    });

    return status;
}

Then you set it up where you call $http like so:

var promise = $http.post(...);
$scope.httpStatus = Status.newStatus(promise);

Then reference it in your html like so:

<div ng-switch on="httpStatus.label">
    <span ng-switch-when="'loading'">Loading…</span>
</div>

---

You can see it in action here: http://jsfiddle.net/hw0pkgp0/