javascript - 如何将更多数据附加到 AngularJS 模型？

Question

到目前为止，我在 Rails 应用程序中设置 AngularJS 模型并为其提供数据以在前端访问时没有任何问题。我什至将其设置为使用 $http 来自 AJAX 请求的数据进行填充。但是，我需要这个模型来包含多个 $http 调用的数据。这是我迄今为止得到的代码:

function DropboxCtrl($scope, $http) {
    var $infiniteLoader = $(".infiniteLoader");
    var theUIDS = $infiniteLoader.attr('data-dropbox-uids').split(',');

    if($infiniteLoader.attr('data-dropbox-uids') != "") {
        var theData = {};

        $.each(theUIDS, function(key) {
            $http({ url: '/dropbox/files/get', method: 'GET', params: { uid: theUIDS[key] }}).success(function(data) {
                theData = data;
            });
        });

        $scope.dropboxes = theData;
    }
}

我有一个名为 DropboxCtrl 的方法，该方法首先获取我需要调用 GET 请求的所有 UID。我循环遍历它们中的每一个，然后将 data 附加到 theData (这是一个 Javascript 对象)。在每个之后，我使我的保管箱模型等于 theData 的值。目前我的方法绝对没有返回任何内容，也没有 Javascript 错误。我确信我的 url 完全有效，并且实际上确实使代码仅使用一个 AJAX 请求即可工作，如下所示:

$.each(theUIDS, function(key) {
    $http({ url: '/dropbox/files/get', method: 'GET', params: { uid: theUIDS[key] }}).success(function(data) {
        $scope.dropboxes = data;
    });
});

但是...该代码块仅返回最后一个 AJAX 调用，因为其他调用已被覆盖。也许我所缺少的只是不正确的Javascript，但是，也许我所缺少的只是缺乏对事物“Angular 方式”的理解。我精通 Javascript 和 jQuery，但对 Angular 还很陌生。有什么帮助吗？

Answer 1

AngularJs 是一个高级 JavaScript 框架。代码最终是javascript。在 $each 中，您可以将结果推送到数组或初始化的集合，例如

$scope.dropboxes = [{uid:1234}, {uid:2345}] and so on.

在 $each 中，找到 uid 的记录并附加结果。 我通常使用 underscorejs 库来对集合、数组等进行操作。 所以类似

_.findWhere($scope.dropboxes, {uid: data.uid }).data = data;

假设返回的数据中有uid。如果没有，那么应该有另一种方法将结果映射到请求。请注意，无法保证响应的顺序，因此您不能使用数组索引来映射结果。