角度版本和承诺的问题

时间:2023-01-06 19:40:00

I don't realize why this code works fine with angularjs 1.2.0-rc.2 but not with later version (I tried with 1.2.0, 1.4.9, 1.5.7)

我没有意识到为什么这个代码适用于angularjs 1.2.0-rc.2但不适用于更高版本(我试过1.2.0,1.4.9,1.5.7)

index.html

<body ng-app="MyApp">
  <h1>Open Pull Requests for Angular JS</h1>
  <ul ng-controller="DashboardCtrl">
    <li ng-repeat="pullRequest in pullRequests">
      {{ pullRequest.title }}
    </li>
  </ul>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.2/angular.js"></script>
  <!--<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.js"></script>-->
  <!--<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>-->
  <!--<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>-->
  <script src="scripts/app.js"></script>
</body>

scripts/app.js

'use strict';

var app = angular.module('MyApp', []);

app.controller('DashboardCtrl', ['$scope', 'GithubService',function($scope, GithubService) {
    $scope.pullRequests = GithubService.getPullRequests();
}]);

app.factory('GithubFactory', ['$q', '$http',function($q, $http) {
    var myFactory = {};
    myFactory.getPullRequests = function() {
        var deferred = $q.defer();
    $http.get('https://api.github.com/repos/angular/angular.js/pulls')
            .success(function(data) {
            deferred.resolve(data); // Success
            })
            .error(function(reason) {
            deferred.reject(reason); // Error
            });

        return deferred.promise;
    }

    return myFactory;

}]);

debugging I can see that the promise is resolved, but the data are not displayed... What's the right way to use the promises?

调试我可以看到承诺已经解决,但数据没有显示......使用承诺的正确方法是什么?

1 个解决方案

#1


2  

It doesn't work because since 1.2 promises are not automatically "unfolded" in templates. You need to set resolved data explicitly:

它不起作用,因为1.2承诺不会在模板中自动“展开”。您需要显式设置已解析的数据:

This is incorrect:

这是不正确的:

$scope.pullRequests = GithubService.getPullRequests();

And should be:

应该是:

GithubService.getPullRequests().then(function(data) {
    $scope.pullRequests = data;
});

And one more thing. You should not construct promises with deferred object because $http service already returns one for you:

还有一件事。您不应该使用延迟对象构造promises,因为$ http服务已经为您返回一个:

app.factory('GithubFactory', ['$http', function($http) {
    var myFactory = {};
    myFactory.getPullRequests = function() {
        return $http.get('https://api.github.com/repos/angular/angular.js/pulls')
            .then(function(response) {
                return response.data;
            });
    };
    return myFactory;
}]);

#1


2  

It doesn't work because since 1.2 promises are not automatically "unfolded" in templates. You need to set resolved data explicitly:

它不起作用,因为1.2承诺不会在模板中自动“展开”。您需要显式设置已解析的数据:

This is incorrect:

这是不正确的:

$scope.pullRequests = GithubService.getPullRequests();

And should be:

应该是:

GithubService.getPullRequests().then(function(data) {
    $scope.pullRequests = data;
});

And one more thing. You should not construct promises with deferred object because $http service already returns one for you:

还有一件事。您不应该使用延迟对象构造promises,因为$ http服务已经为您返回一个:

app.factory('GithubFactory', ['$http', function($http) {
    var myFactory = {};
    myFactory.getPullRequests = function() {
        return $http.get('https://api.github.com/repos/angular/angular.js/pulls')
            .then(function(response) {
                return response.data;
            });
    };
    return myFactory;
}]);