范围未在资源回调函数之外更新答案

【问题标题】：Scope not updated outside resource callback function范围未在资源回调函数之外更新
【发布时间】：2014-07-23 19:22:38
【问题描述】：

我在 AngularJS 中有一个名为 WebService 的工厂，它返回一个 $resource 对象。

angular.module('cstarsServices')
.factory('WebService', function ($resource)
{
    return $resource("some_url_here/:op1/:op2/:op3/:op4",
            {op1: 'indexes'},
            {
                getIndexes: {
                    isArray: true,
                    method: 'GET'
                }

            }
        );
});

在我的一个控制器中，我调用 getIndexes：

WebService.getIndexes(function(data){

    // SearchIndex Table
    $scope.languages = [];
    var languages = [];
    var ajaxResponse = [];


    angular.forEach(data, function (item, i)
    {
        if (item.sourceTypes != null)
        {
            ajaxResponse.push({ selected: false, name: item.name, languages: item.sourceTypes[0] });
            languages[item.sourceTypes[0]] = item.sourceTypes[0];
        }
    });
    $scope.searchIndexes = ajaxResponse;


    for (var key in languages)
    {
        $scope.languages.push(languages[key]);
    }
    $scope.language = languages[0];
});
//This is undefined
alert($scope.searchIndexes);

然而，这似乎并没有正确更新 $scope：例如，$scope.searchIndexes 的值已定义并且在函数的 inside 中具有正确的数据，但在函数外部未定义。发生了什么事，我怎样才能让 $scope 更新整个控制器，而不仅仅是在回调函数内部？提前感谢您的帮助。

【问题讨论】：

标签： javascript angularjs scope ngresource

【解决方案1】：

您的 WebService.getIndexes 函数正在进行异步 AJAX 调用。其下方的alert() 命令在调用WebService.getIndexes 之后立即执行，但在后端服务实际返回任何数据之前。因此，您在 AJAX 调用中执行的 $scope 分配实际上发生在 alert() 命令（或控制器中不在函数中的任何其他代码）之后。

尝试在 AJAX 调用结束时添加alert($scope.searchIndexes);。您会注意到，此警报的输出实际上会出现在以下您的 alert() 在 AJAX 调用之外的输出。

如果不查看控制器的其余部分，很难推荐一种解决方法。但这里的一般经验法则是仅在函数内引用$scope.searchIndexes。只要这些函数仅在控制器完全加载后调用，您就可以毫无问题地引用$scope.searchIndexes。

【讨论】：