How to assign JSON (in a subscribe) to a variable in angular

Question

I have this code snippet where I want to assign res (which logs the whole json), to the json variable , but i'm unable to do it, since the logging of the json variable will return me an undefined object

export class AppComponent {

    title = 'app2';
    json ;

    constructor(private jsl : JsonLoadService)
    {
        this.json = this.jsl.getUrl().subscribe(res => {
            console.log(res);
        });
    }
}

Answer 1

You should do this inside the subscription like below

this.jsl.getUrl().subscribe(res => {
   this.json = res;
   console.log(this.json); // component variable now defined.
})

remember that due to the async nature of subscriptions that this.json will only be defined after the subscription has run. This example should help visualise.

public ngOnInit(): void 
{
    this.jsl.getUrl().subscribe(res => {
       this.json = res;
       this.logData(); // will log your result
    });

    this.logData(); // will not log and will error

}

public logData(): void 
{
    console.log(this.json);
}