在角度js

Question

我有一个页面，我需要打2个宁静的网络服务电话。第一次休息是成功的，我正在收回数据。点击第二次服务后，第一次调用的数据仍然存在于变量中。那么使用回调方法就是解决这个问题的方法呢？如果是这样，如何用angularjs方式编写回调方法？

这是我的代码。

app.directive('collection', function() {
    return {
        restrict: "E",
        replace: true,
        scope: {
            collection: '=',
            articleData: '=',
            articleContent: '='
        },
        template: "<ul><member ng-repeat='member in collection' member='member' article-data='articleData' article-content='articleContent'></member></ul>"
    }
});

app.directive('member', function($compile,$http,getTocService) {
    return {
        restrict: "A",
        replace: true,
        scope: {
            member: '=',
            articleData: '=',
            articleContent: '='
        },
        template: "<div><li><a href='#' ng-click='getContent(member.itemId)'>{{member.title}}</a></li></div>",
        link: function(scope, element, attrs) {
            scope.getContent = function(itemId) {
                    var art = getTocService.getArtData(itemId);
            }

            if (angular.isArray(scope.member.tocItem)) {
                if (scope.member.hasChildren == "true") {
                    for (var i = 0; i < scope.member.tocItem.length; i++) {
                        if (scope.member.tocItem.title) {
                            scope.member.tocItem.title.hide = true;
                        }
                    }
                }
                element.append("<collection collection='member.tocItem'></collection>");    
                $compile(element.contents())(scope)
            }
        }
    }
});


app.controller('apdController', function($scope, getTocService,$location) {
    var bookId = $location.search().id;
    var sampdata = getTocService.getToc(bookId);
    $scope.tasks =sampdata;
//  $scope.tasks = data;

//    var artData = getTocService.getArtData('PH1234');
//    $scope.articleContent = artData;
});

app.service(
        "getTocService",
        function( $http, $q ) {
            return({
                getToc: getToc,
                getArtData: getArtData
            });

            function getToc(bookIdvar) {
                var request = $http({
                    method: "post",
                    url: "http://10.132.241.41:8082/apdpoc/services/ApdBookService/getTOC",
                    params: {
                        action: "post"
                    },
                    data: {
                        getTOCCriteria:{
                        bookId: bookIdvar
                        }
                    }
                });
                return( request.then(handleSuccess,handleError));
            }

            function getArtData(itemId) {
                var request = $http({
                    method: "post",
                    url: "http://10.132.241.41:8082/apdpoc/services/ApdBookService/getArticle",
                    params: {
                        action: "post"
                    },
                    data: {
                        getArticleCriteria:{
                        articleId: itemId,
                        locale: "en_US"
                        }
                    }
                });
                alert(data);
                return( request.then(handleSuccess,handleError));
            }
            function handleSuccess(response){
                return (response.data);
            }

            function handleError( response ) {

                if (
                    ! angular.isObject(response.data) ||
                    ! response.data.message
                    ) {
                    return($q.reject("An unknown error occurred."));
                }
                return($q.reject(response.data.message));
            }

        }
);

这里，“data”是我在保存响应数据的两个调用中使用的变量。我从

调用第二服务“getArtData”

 var art = getTocService.getArtData(itemId);

Answer 1

您应该强烈考虑使用 promises 。承诺允许链接，并且比回调地狱好多了。这里的关键字是使用然后。

这篇SO帖子更好地解释了它：Processing $http response in service

希望这对你有所帮助。

Answer 2

您的getTocService会返回承诺，您需要链接这两个承诺。

var bookId = $location.search().id;
var sampdataPromise = getTocService.getToc(bookId);

sampdataPromise.then( function(data) {
    $scope.tasks = data;
    //return next promise for chaining
    return getTocService.getArtData(data.itemId);
}).then (function (artData) {
    $scope.articleContent = artData;
}).catch (function (error) {
    //log error
});