title: Angular Firebase - Get observable from reference field
body: <p>Let's assume I have the following firestore structure:</p>
  
  <pre><code>"Objects": {
    "Object1": {
      "Material_Ref": &lt;DocRef&gt;;
    },
    "Object2": {
      "Material_Ref": &lt;DocRef&gt;;
    },
  }
  
  "Materials": {
    "Name": string;
    "Type": string;
  }
  </code></pre>
  
  <p>And I want to listen for changes on materials, by accessing from each object's material reference document, how could I achieve this?</p>
  
  <pre><code>&lt;ul *ngIf="materials | async"&gt;
      &lt;li *ngFor="let material of materials"&gt;
         {{ material.Name }} and {{ material.Type }}
      &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>Edit: The HTML chunk above is how I want to retrieve data, and I ask what I need to do in the component to pass materials in such way. I add this, due to answers being irrelevant to what I ask for. </p>