Javascript AngularJS JSONP未将键值更新为对象

我试图用

//第二个JSONP

回调函数更新

channel.status

对象

angular.element(document).ready(function() {
    channels = [];
    channel = {};

    followersAPI = followersAPI.replace(/theUser/, user);
    followersAPI = $sce.trustAsResourceUrl(followersAPI);

    // First JSONP
    $http.jsonp(followersAPI).then(function (response) {
        var follows = response.data.follows;

        for (var i = 0; i < follows.length; i ++) {
            var currentChannel = follows[i].channel;

            if (currentChannel.status == null) {
                currentChannel.status = "offline";
            }

            channel = {
                name: currentChannel.name,
                display_name: currentChannel.display_name,
                logo: currentChannel.logo,
                url: currentChannel.url,
                status: "loading"
            };

            streamAPI = "https://wind-bow.glitch.me/twitch-api/streams/";
            streamAPI += channel.name;
            streamAPI = $sce.trustAsResourceUrl(streamAPI);

            // Second JSONP
            $http.jsonp(streamAPI).then(function (response) {
                data = response.data;
                if (data.stream == null) {
                    channel["status"] = "offline";
                } else {
                    channel["status"] = data.stream.channel.status;
                }
            });
            channels.push(channel);
        }
    });
    $scope.channels = channels;
    console.log($scope.channels);
});

---

对于

For loop

中的异步调用

$http.jsonp

，在其回调中，您将只获得最后定义的

通道的实例。作为解决方案，您应该将
通道的所有内容移动到
第二个jsonp

var currentChannel = follows[i].channel;

streamAPI = "https://wind-bow.glitch.me/twitch-api/streams/";
streamAPI += channel.name;
streamAPI = $sce.trustAsResourceUrl(streamAPI);

// Second JSONP
$http.jsonp(streamAPI).then(function (response) {
    data = response.data;
    if (currentChannel.status == null) {
        currentChannel.status = "offline";
    }

    channel = {
        name: currentChannel.name,
        display_name: currentChannel.display_name,
        logo: currentChannel.logo,
        url: currentChannel.url,
        status: "loading"
    };

    if (data.stream == null) {
        channel["status"] = "offline";
    } else {
        channel["status"] = data.stream.channel.status;
    }
    channels.push(channel);
});

不幸的是，我以前试过，但它导致了一些其他问题：如果我推
channels.push（channel）
进入
//第二个JSONP
，除了
$$hashKey
之外，
频道{}
中的所有其他属性都被复制；如果它在外部（以及
for loop
内部），则会显示
错误：[ngRepeat:dupes]中继器中不允许重复。
@hanabinoir您可以添加
track by$index
以避免该错误。结果没有错误消息，但属性仍然重复。在
for循环中使用
jsonp
中的回调可能不好，如果
第二个jsonp
有重复的结果，它将是重复的
track by$index
将允许
ng repeat
忽略重复项，但显示所有记录。正如您所说，
jsonp
回调只从for循环中获取最后一个定义，并复制它。我正在寻找一种比这更好的结构，在
for循环
中使用
jsonp
。
var currentChannel = follows[i].channel;

streamAPI = "https://wind-bow.glitch.me/twitch-api/streams/";
streamAPI += channel.name;
streamAPI = $sce.trustAsResourceUrl(streamAPI);

// Second JSONP
$http.jsonp(streamAPI).then(function (response) {
    data = response.data;
    if (currentChannel.status == null) {
        currentChannel.status = "offline";
    }

    channel = {
        name: currentChannel.name,
        display_name: currentChannel.display_name,
        logo: currentChannel.logo,
        url: currentChannel.url,
        status: "loading"
    };

    if (data.stream == null) {
        channel["status"] = "offline";
    } else {
        channel["status"] = data.stream.channel.status;
    }
    channels.push(channel);
});