IonicPage() deeplink causing Cannot read property ' <property>' of undefined

I am trying to use ionicpage to create deep links in my app. Currently it works if I just launch ionic using localhost:8100. If I try to use the deeplink directly “http://localhost:8100/#/tab-page/recent/detail/48845”. I get Cannot read property ‘acf’ of undefined. acf being Advanced custom fields in json from the wordpress api.

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { ApiProvider } from '../../providers/api/api';
import {NgClass} from '@angular/common';

/**
 * Generated class for the DetailPage page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */
@IonicPage({
  
  segment: 'detail/:post_id',
  defaultHistory: ['HomePage'],
  priority: 'high'
})
@Component({
  selector: 'page-detail',
  templateUrl: 'detail.html',
})
export class DetailPage {

  public post: any = [];
  public isLoading: boolean = false;
  public relatedItems: any = [];
  public youtube: any = [];
  acf:any;
  

  constructor(public navCtrl: NavController, public navParams: NavParams,
              public api: ApiProvider) {
    //console.log(navParams.get('post'));
    this.post = navParams.get('post');
    this.acf = navParams.get('acf');
  }

  ionViewDidLoad() {
    this.getRelated();
  }

  getRelated(){
    if(!this.isLoading){
      this.isLoading = true;
      this.api.get('posts?_embed&categories='+this.post.categories[0])
      .subscribe((data:any) => {
      this.isLoading = false;  
      this.relatedItems = data;
    },
    (error) => {
      this.isLoading = false;
    console.log(error);
    });
  }
  }

  /*openDetail(item) {
    this.navCtrl.push('DetailPage', {post:item});
  }*/

 openDetail(item, post_id) {
  this.navCtrl.push('DetailPage', { post: item, post_id: post_id});
}




}

The above code works if I just run it normally. I can load posts from homepage and see the “http://localhost:8100/#/tab-page/recent/home” url and if I select a post I can see “http://localhost:8100/#/tab-page/recent/detail/48845”. The problem is that if I try to use the “http://localhost:8100/#/tab-page/recent/detail/48845” url directly I get the cannot read property of undefined error.

Help with this will be appreciated