title: Angular 13 loading JSON file with HTTP Get
body: <p>i try to get some JSON Data from a local file in assets. I search with google and found different solutions, but nothing is working, like i want.</p>
  <p>i add a service with follow code:</p>
  <pre><code>import { Injectable } from '@angular/core';
  import { HttpClient } from '@angular/common/http';
  import { Observable } from 'rxjs';
  import { map } from 'rxjs/operators';
  
  @Injectable({
    providedIn: 'root'
  })
  
  export class JSONService {
      public JSONArr: any;
  
      constructor(private http: HttpClient ) { }
  
      initJSON(path: string = &quot;&quot;) { 
          this.JSONArr = this.getJSONArr(path);
          
          console.log(&quot;@ Service&quot;);
          console.log(path);
          console.log(this.JSONArr);
          // return this.JSONArr;
      }
  
      async getJSONArr( path: string = &quot;&quot;): Observable&lt;any&gt; {
          return this.http.get(path).subscribe(data =&gt; { 
              this.JSONArr = data;
              console.log(data);
          }
      }
  
      
  }
  </code></pre>
  <p>the path is given from the app.component.ts
  the JSON look as follow</p>
  <pre><code>{
          &quot;title&quot;: &quot;Testtitle&quot;,
          &quot;content&quot;: &quot;Test Message&quot;
  }
  </code></pre>
  <p>My problem is:
  the console.log within the <strong>getJSONArr</strong> returns the data from the json correctly,
  but the console.log within the <strong>initJSON</strong> returns <strong>undefined</strong></p>
  <p>can anyone help me ?</p>