Using AngularFire2 how to convert data to an ObservableList containing other Observables

Question

I'm a little new to this, so bear with me. I will try my best to explain. I am using AngularFire2 and getting the data as a list . In my case, I am trying to get a list of transactions associated with an account (see the sample data below).

Data examples

accounts: {
  account1: {
    name: "Account 1",
    transactions: {
      transaction1: {
        date: somedate
      },
      transaction2: {
        date: somedate
      }
    }
  }
}

transactions: {
  transaction1: {
    name: "Transaction 1"
  },
  transaction2: {
    name: "Transaction 2"
  },
  transaction3: {
    name: "Transaction 3"
  }
}

My first step was to get a list of transactions from my account:

af.database.list('/accounts/account1/transactions');

This gives me a visible array of objects like this:

[Object, Object]

Then, I would like to completely replace these two objects with the actual transaction data from the node transactions. So something like this:

af.database.list('/accounts/account1/transactions')
.map(res => {
  return res.map(items => {
    return af.database.list('/transactions/items.$key');
  })
})

This sorta gets me what I want, except that now I have an observable array of observables instead of such objects:

[Observable, Observable]

, async Elvis :

<ul>
  <li *ngFor="let transaction of transactions | async">{{ (transaction | async)?.name }}</li>
</ul>

, - :

af.database.list('/accounts/account1/transactions')
.map(res => {
  return res.map(transaction => {
    transaction.details = af.database.list('/transactions/' + transaction.$key);
    transaction.account = af.database.list('/accounts/' + accountKey);
  })
})

, , , - . , , , . , . , , inital angularfire2. , :

{
  date: somedate,
  details: Observable,
  account: Observable
}

:

{
  date: somedate,
  name: "Transaction 1",
  accountName: "Account 1"
}

, , , , . - ? , - .

flatMap concatMap, , , .