Question

在以下代码中，返回调用服务器方法“ getUserNames（）”，该方法返回JSON并将其分配给 main.teamMembers 变量。我正在构建的报告中有一个 viewAll 按钮，该按钮调用下面列出的方法“ $ scope.viewAllTeamMembers = function（$ event）”。
现在，“查看全部”按钮列出了第一次加载报告时在 main.teamMembers 中存储的所有值均不起作用。但是，当我导航到报表中的其他按钮并尝试访问 viewAll 时，它会起作用。
我询问从匿名返回JSON的原因是，我发现 viewAll 按钮在其为全局变量时首次起作用。请帮助我了解我所缺少的内容。

angular.module('kamApp')
    .controller('MainCtrl', [
        '$q',
        '$rootScope',
        '$scope',
        '$timeout',
        'endpoints',
        'kamService',
        'queries',
        'translations',
        function($q, $rootScope, $scope, $timeout, endpoints, kamService, queries, translations) {

            var getUserNamesRequest = endpoints.getUserNames($rootScope.teamMemberIds).then(function(userDdata){
                return userDdata;
            });

            getUserNamesRequest.then(function(userDdata,$scope)  {

                $rootScope.userNameList = kamService.extractUserNameList(userDdata);

                main.teamMembers=kamService.concatTeamMemberName(
                    main.teamMembersData,
                    $rootScope.userNameList.list
                );

                main.teamMembers.list = kamService.sortList(main.teamMembers.list, 'role', 'name');  

            });
    }]);

--Directive

    angular.module('kamApp')
    .directive('teamMember', function() {

        return {
            templateUrl: 'views/team-member.html',
            replace: true,
            restrict: 'E',
            scope: {
                teamMembers: '=',
                viewSwitch: '=',
                changeReportTitle: '&'
            },
            link: function($scope) {

                $scope.itemLimit = 4;

                $scope.isOddLength = $scope.teamMembers.list.length % 2 !== 0;

                $scope.viewAllTeamMembers = function($event) {
                    $event.target.style.opacity = 0.6;
                    $scope.viewSwitch.dashboard = false;
                    $scope.viewSwitch.teamMember = true;
                    $scope.changeReportTitle()($scope.teamMembers.objectName.plural);
                };
            }
        };
    });

-HTML代码

 "<div class=\"expand-link inline-block-div\" ng-click=\"viewAllTeamMembers($event)\"> \n"+

Answer 1

在示例1中，您将usernames设置为getUserNames().then()返回的承诺而不是返回值，并且JSON.stringify(userNames);在AJAX请求完成之前运行。

在示例2中，再次JSON.stringify(userNames);在AJAX请求完成之前正在运行。

相反，您应该将依赖于result的代码放在then回调中。

var result={};

getUserNames($rootScope.teamMemberIds).then(function(userDdata){
    result = userDdata;
    // Code dependent on result
});

如果您要运行依赖于所设置变量的其他代码

var result={};

var getUserNamesRequest = getUserNames($rootScope.teamMemberIds).then(function(userData){
    result = userData;
    // Code dependent on result

    // return the data so that chained promises get the original data.
    return userData;
});

// Other code dependent on `result` being set.
getUserNamesRequest.then((userData) => {
    // use either `result` or `userData` here.
});

从匿名函数返回JSON或任何值-AngularJS

1 个答案: