angularjs_Promis | 码农工具

​x
 
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>文档标题</title>
<script src="https://cdn.staticfile.org/angular.js/1.6.5/angular.min.js"></script>
</head>
<body>
    <div ng-app="MyApp">
    <div ng-controller="MyController">
        <label for="flag">成功
            <input id="flag" type="checkbox" ng-model="flag" />
            <br/>
        </label>
        <div ng-cloak>
            {{status}}
        </div>
        <hr/>
        <button ng-click="handle()">点击我</button>
    </div>
</div>
</body>
</html>

HTML

xxxxxxxxxx
 
angular.module("MyApp", [])
    .controller("MyController", ["$scope", "$q", function ($scope, $q) {
    $scope.flag = true;
    $scope.handle = function () {
        var deferred = $q.defer();
        var promise = deferred.promise;
​
        promise.then(function (result) {
            result = result + "you have passed the first then()";
            $scope.status = result;
            return result;
        }, function (error) {
            error = error + "failed but you have passed the first then()";
            $scope.status = error;
            return error;
        }).then(function (result) {
            alert("Success: " + result);
        }, function (error) {
            alert("Fail: " + error);
        })
​
        if ($scope.flag) {
            deferred.resolve("you are lucky!");
        } else {
            deferred.reject("sorry, it lost!");
        }
    }
}]);

JavaScript