无法使用 firebase 和 AngularJS 创建链接承诺，FirebaseArray 具有两个顺序调用以从链接的两个不同表中获取数据

Question

我有以下两个包含服务和类别的表格：

   - servicecat
      - catid
        - name : "Category Name"
        - services
            - srvid1 : true
            - srvid2 : true
            - srvid3 : true
   - services
     - srvid
        - name: "Service Name"
        - Details: "blabla"
        - servicecat:
            - catid1 : true
            - catid2 : true

我正在尝试构建一个 firebaseArray 以在用户单击服务时显示其信息和类别。

<script>

var app = angular.module("sampleApp", ['firebase']);
var fb = firebase.database().ref();

app.factory("getServices", ["$firebaseArray",
  function($firebaseArray) {
    var ref = firebase.database().ref().child("services");
    return $firebaseArray(ref);
  }
]);

app.controller("mainController", ["$scope", "$firebaseArray","$firebaseObject","getServices",
  function($scope, $firebaseArray, $firebaseObject, getServices) {
    $scope.services = getServices;

    $scope.postFullService = function(srvid) {
      var ref = fb.child('services/'+srvid);
      $scope.selectSrvtoPost = $firebaseObject(ref);
      var ref2 = fb.child('services/'+srvid+'/servicecat/');
      var list = $firebaseArray(ref2).$loaded()
      .then(function(snap) {
        $scope.selectCategories = snap;
        snap.forEach(function(snap2) {
          $scope.selectCategories.catid = snap2;
          var id = $scope.selectCategories.catid.$id;
          var ref3 = fb.child('servicecat/'+id);
          var list2 = $firebaseObject(ref3).$loaded()
          .then(function(snap3) {
            $scope.selectCategories.catname = snap3;
          })
        })
      })
      .catch(function(error) {
        console.log("Error: ", error);
      })
    }
  }
]);
</script>

<body ng-app="sampleApp">
  <div ng-controller="mainController">
    <h1>Services List</h1>
    <ul>
      <li ng-repeat="service in services" ng-click="postFullService(service.$id)" class="click"><strong>{{ service.title }}</strong><br>{{ service.details }}</li>
    </ul>
    <h2>Service Selected</h2>
    <ul>
      <li><strong>{{ selectSrvtoPost.title }}</strong><br>{{ selectSrvtoPost.details }}</li>
     <h3>Selected Categories</h3>
     <hr>
     {{ selectCategories }}
     <hr>
     {{ selectCategories.catid }} <br> {{ selectCategories.catid.$id }} <br> {{ selectCategories.catname.name }} <hr>
     <br><strong>UL:</strong> 
     <ul>
      <li ng-repeat="catselect in selectCategories">
        {{ catselect.$id }} <br>
        Catid : {{ catselect.catid }}

      </li>
     </ul>
  </div>
</body>

我似乎找不到让它工作的方法。我实现了在控制台中显示结果，但我无法创建可以在 DOM 中使用的 firebaseArray 来操作两个表及其链接的记录。看来我应该使用链接承诺来解决问题，但我不太明白它是如何工作的。

Answer 1

重要的是要意识到立即调用 $firebaseObject 服务或 $firebaseArray 服务 returns 一个空引用（对象或数组）。一旦数据从服务器返回，现有引用就会填充实际数据。引用有一个 property called $loaded 函数，它 returns 一个承诺，当从数据库下载初始对象（或数组）数据时，该承诺将得到解决。承诺解析为 $firebaseObject 或 $firebaseArray 本身。

  var objectPromise = $firebaseObject(ref).$loaded();
  var arrayPromise =  $firebaseArray(ref).$loaded();

承诺是 $q Service promises which are integrated with the AngularJS framework digest cycle so that changes to $scope will automatically update the DOM. For this reason, It is better use the .then method of AngularFire $q 服务承诺，而不是核心 Firebase 客户端库返回的承诺方法 .then。

来自 $q 服务的链承诺通过对 Firebase 服务器的多次调用创建数据。

无法使用 firebase 和 AngularJS 创建链接承诺，FirebaseArray 具有两个顺序调用以从链接的两个不同表中获取数据

Can't create a chaining promise with firebase and AngularJS, a FirebaseArray with two sequential calls to fetch data from two different tables linked

denormalization

angularjs

firebase

angular-promise

firebase-realtime-database