在AngularJS中将json添加到作用域

adding json to scope in AngularJS

本文关键字：作用域 添加 json AngularJS 中将      更新时间：2023-09-26

我在json中连接两个对象，并将其分配给angularjs中的$scope。但却无法做到同样的事。代码如下

//https://wind-bow.hyperdev.space/twitch-api/channels/ESL_SC2
/*Global Variable*/
var responseData=[];
var responseDataValues=[];
var twitch = angular.module("twitch",[]);
twitch.controller("listStremers",streamMe);
function streamMe($scope,$http)
{
  var streamers=["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas","comster404","brunofin"];
  for(var i=0;i<streamers.length;i++)
    {
      $http({
        method:"jsonp",
        url:"https://wind-bow.hyperdev.space/twitch-api/streams/"+streamers[i],
        params:{ 
            format: 'json',
            callback: 'fitData'
        }
      });
      $http({
        method:"jsonp",
        url:"https://wind-bow.hyperdev.space/twitch-api/channels/"+streamers[i],
        params:{ 
            format: 'json',
            callback: 'fitDataValues'
        }
      });
    }
 $scope.twitchData=makeJson(responseDataValues,responseData);
  $scope.filStatus={};
  $scope.clear=function(){
    $scope.filStatus={};
    console.log($scope);
  }
}
function fitData(response)
  {
    responseData.push(response);
  }
function fitDataValues(response)
{
  console.log(response);
  responseDataValues.push(response);
}
function makeJson(arr1,arr2)
{
  for(var i=0;i<arr1.length;i++)
    {
      arr1[i].stream=arr2[2].stream;
      if(arr1[i].stream==null&&arr1[i].status==404)
      {
        arr1[i].liveStatus="offline";
      }
      else if(arr1[i].status==404)
      {
        arr1[i].liveStatus="dead";
      }
      else
      {
        arr1[i].liveStatus="online";
      }
      //console.log(arr1[i]);
      //console.log(arr2[i]);
    }
  //console.log(arr1);
  return arr1;
}

在上面的makeJson函数代码中，我必须在arr1[I]对象中创建一个新的liveStatus，流属性并为其赋值，但代码执行没有任何问题，但是没有值被分配给arr1，同样被分配给控制器中的$scope。我是AJ和javascript的新手，请帮助

这个问题是因为您正在连接的数据来自http调用，这是异步的，在您的数据通过http调用之前，行

 $scope.twitchData=makeJson(responseDataValues,responseData);

在两个空白数组中执行。你可以通过promise resolve，或者用一种简单的方法在您的代码中进行以下更改:

function fitData(response)
{
    responseData.push(response);
    if(responseDataValues.length){
        $scope.twitchData=makeJson(responseDataValues,responseData);
    }
}
function fitDataValues(response)
{
   console.log(response);
   responseDataValues.push(response);
    if(responseData.length){
        $scope.twitchData=makeJson(responseDataValues,responseData);
    }
}

HTTP调用将花费更多的时间来调用两个数组都有值的函数调用

相关文章：