从angularjs中的多个异步源填充数据并在对象中合并

时间:2018-01-26 02:42:57

标签: angularjs firebase firebase-realtime-database

我是angularJS的新手以及延迟/承诺的整个概念,所以这可能不是最干净的代码,但想知道我在这里做错了什么。

我的第一次异步通话工厂基本上是我从Firebase获取数据(库存名称和数量)然后 在我的第二次异步通话中,我尝试使用$ http获取当前价格等其他详细信息。当我成功获取详细信息时,我无法将其合并到控制器中的对象中,并使用ng-repeat将其显示为表格。

portfolio.controller('updatePortfolio', function($scope,stockFactory,$http){
init();

function init()
{
    $scope.stocks = stockFactory.getStocks();
}
}



function updatePrice()
{
    $http.get('//call for api')
    .then(function(response))
    {
        $scope.stocks[0].price = response.data;  //error "Unable to get property '0' of undefined or null reference"
    }
// similar call to update rest of the stocks... planning to do it using $q.all if i can somehow figure how to merge this.
}
});

控制器如下:但收到错误"无法获得属性' 0'未定义或空引用"我假设,因为股票可能还没有填充。有没有更好的方法来填充价格

<table>
<tr>
    <th>Stock</th><th>Price</th><th>Holding</th><th>Value</th>

</tr>
<tr data-ng-repeat="s in stocks">
    <td>{{s.name}}</td>
    <td>{{s.price}}</td>
    <td>{{s.holding}}</td>
    <td>{{s.price * s.holding}}</td>
</tr>

前端:

<input type="number" size="10" >

1 个答案:

答案 0 :(得分:0)

您将在工厂方法中返回未定义的对象。返回股票的承诺。

factory.getStocks = function(){
  var promise =  firebase.database().ref().child("Stock").once('value');
  return promise.then(callback) //returns stocks
};

在您的控制器中

portfolio.controller('updatePortfolio', function($scope,stockFactory,$http){
   init();

   function init() {
      //set your scope variables inside the promise success handler
      stockFactory.getStocks().then(function(stocks) {
         $scope.stocks = stocks;
      }).then(function(){
        $http.get(api call).then(function(response) {
          $scope.stock[0].price = response.data;
      });
   }
  });