當承諾解析時，AngularJS不顯示數據

在承諾解決後，我的表不會顯示它收到的數據。但是，數據會在更新過濾器查詢後顯示。當承諾解析時，AngularJS不顯示數據

角：

let app = angular.module("tierlist", []); 

app.controller("tierListController", function ($scope, $http) { 


    firebase.database().ref('/Primaries/').once('value').then(function (snapshot) { 
     console.log(snapshot.val()); 

     $scope.Primaries = $.map(snapshot.val(), function (element) { 
      return element; 
    }); 
    console.log($scope.Primaries); 
    }); 

});

HTML：

<div class="container tiertab" id="Primaries"> 
    <table id="primariesTable" class="table table-condensed table-responsive sortable"> 
     <thead> 
     <tr> 
      <th onclick="sortTable('primariesTable', 0)">Rank</th> 
      <th onclick="sortTable('primariesTable', 1)">Weapons</th> 
      <th onclick="sortTable('primariesTable', 2)">Primary DMG Type</th> 
      <th onclick="sortTable('primariesTable', 3)">CC Mechanic</th> 
      <th onclick="sortTable('primariesTable', 4)">MR Req</th> 
      <th>Notes</th> 
      <th>Base or Event Rankings</th> 
      <th>Suggested Builds</th> 
     </tr> 
     </thead> 
     <tbody> 
     <tr class="sortable" ng-repeat="primary in Primaries | filter: $ctrl.query" > 
      <td>{{primary.rank}}</td> 
      <td>{{primary.name}}</td> 
      <td>{{primary.damage}}</td> 
      <td>{{primary.cc}}</td> 
      <td>{{primary.mr}}</td> 
      <td>{{primary.notes}}</td> 
      <td>{{primary.event}}</td> 
      <td>{{primary.builds}}</td> 
     </tr> 
     </tbody> 
    </table> 
</div>

我相信我做錯了什麼，只要控制器參與。如果數據與給定字段相關聯，爲什麼數據在解析承諾後不顯示？

來源

2017-09-26 Nader

'$ scope.Primaries = $ .map（snapshot.val（）' - 你如何訪問（假設）jQuery對象？嘗試將'element'記錄到控制檯從循環內部並告訴我你看到的是什麼 – IzzyCooper

我正在訪問使用HTML代碼中的ng-repeat指令的Primaries數組，我也完全確定數據加載正確並且分配正確。回調中的主要部分顯示Primaries是正確的，但回調之外的Primar日誌正確顯示沒有數據，這通過在查詢更改後表正確加載這一事實得到了進一步的證明 – Nader

當$ scope bound數據異步更新時，角度不會更新視圖，因爲它不知道何時會發生這種情況。您的數據在過濾時可能會更新，因爲angular在內部觸發$ scope。$ digest（）。你可以嘗試：

$scope.$evalAsync(function() { 
    $scope.Primaries = $.map(snapshot.val(), function (element) { 
     return element; 
    }); 
});

這應該更新視圖。 $ evalAsync是在angularjs 1.2中引入的，但您可以使用$ scope。$ apply如果您使用的版本較舊。這篇文章有兩個區別很大的信息：https://stackoverflow.com/a/23102223/7083204

來源

2017-09-26 01:24:12

感謝您幫助我解決問題！也會檢查提供的鏈接。 – Nader

當承諾解析時，AngularJS不顯示數據

回答

相關問題