Angular - Wait until I receive data before loading template

Question

So, I have a component that renders several components dynamically, with this template:

Answer 1

{{homeData?.meta[0].site_desc}}

Just Used a "?" after the variable that has been getting loaded with data from the server.

home.component.ts

import { Component, OnInit } from '@angular/core';
import { HomeService } from '../services/home.service';

@Component({
  selector: 'app-home',
  templateUrl: './home.component.html',
  styleUrls: ['./home.component.scss']
})
export class HomeComponent implements OnInit {
  public homeData: any;
  constructor(private homeService: HomeService) {}

  ngOnInit(): void {
    this.homeService.getHomeData().subscribe( data => {
      this.homeData = data[0];
    }, error => {
      console.log(error);
    });
  }
}