title: How to show a specific object in object array (Angular 5, TypeScript)
body: <p>I have a data provider in Angular 5.</p>
  
  <pre><code>export class DataProvider {
    location: any;
  
    private locations: any[] = [
      {
        "name": "restaurant",
        "location": "downtown",
        "category": "restaurant",
        "id": "1"
      },
  
      {
        "name": "law firm",
        "location": "center city",
        "category": "office",
        "id": "2"
      },
  
      {
        "name": "public library",
        "location": "suburb",
        "category": "library",
        "id": "3"
      } ]
  </code></pre>
  
  <p>and here's my HTML file. </p>
  
  <pre><code>&lt;div *ngFor="let location of locations"&gt;
     &lt;h1&gt;&lt;/h1&gt;
      &lt;h2&gt;&lt;/h2&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>In this scenario, how can I load a specific object (item) in data array with certain attributes?
  For instance, If I want to load an object with <code>"category" :"restaurant"</code>, what should I do on my HTML file? so the two others should not show up. I just want to load one out of three by using this specific attribute.</p>
  
  <p>Thanks.</p>