Ошибка @viewchild при выполнении Ionic Refresher

Question

В моем приложении Ionic у меня есть вкладка с компонентом с картой (Mapbox). Когда я открываю страницу в первый раз, карта создается хорошо. Однако, когда я делаю переподготовку (с) на этой вкладке, карта не создается (она отображается пустой). Это мой упрощенный код:

Tab3.page.html на этой странице я "внедряю" свой компонент полной карты

<ion-header no-border>
    <ion-toolbar>
        <ion-title>
            App
        </ion-title>
    </ion-toolbar>
    <div style="margin: 10px"></div>

    <ion-grid>
        <ion-row>
            <ion-col size="12" size-lg="3" size-md="4" size-sm="6" size-xs="12">
                <div class="postfullmap">
                    <ion-item-sliding>
                        <app-fullmap></app-fullmap>
                    </ion-item-sliding>
                </div>
            </ion-col>
        </ion-row>
    </ion-grid>

</ion-header>

<ion-content color="light">

    <!-- Refresher -->
    <ion-refresher slot="fixed" (ionRefresh)="reload($event)">
        <ion-refresher-content></ion-refresher-content>
    </ion-refresher>

    <!-- Posts -->
    <app-myposts [myposts]="posts"></app-myposts>

</ion-content>

Tab3.page.ts

@Component({
  selector: 'app-tab3',
  templateUrl: 'tab3.page.html',
  styleUrls: ['tab3.page.scss']
})
export class Tab3Page implements OnInit {

  posts: Post[] = [];
  enabled = true;

  constructor( private userService: UserService,
               private postsService: PostsService,
               private fullmap: FullmapComponent ) {}

  ngOnInit() {
    this.reload();
    this.postsService.newPost.subscribe( post => {
      this.posts.unshift( post );
    });
  }

  reload( event? ) {
    setTimeout( () => {
      this.following( event, true );
      this.posts = [];
      this.enabled = true;
    }, 2000);
  }

  async following( event?, pull: boolean = false  ) {
    .....
    });
  }

}

fullmap.component.html

<div id='fullmap' #fullmap></div>

fullmap.component.ts

declare var mapboxgl: any;
let map;

@Component({
  selector: 'app-fullmap',
  templateUrl: './fullmap.component.html',
  styleUrls: ['./fullmap.component.scss'],
})
export class FullmapComponent implements OnInit, AfterContentInit {

  private fullmap: ElementRef;

  // @ViewChild('fullmap', {static: false}) fullmap: ElementRef;
  @ViewChild('fullmap', {static: false}) set content(fullmap: ElementRef) {
    this.fullmap = fullmap;
  }

  constructor( ) {
  }

  ngAfterViewInit() {

  }

  public ngAfterContentInit() {

    setTimeout( () => {

      mapboxgl.accessToken = 'mytoken';

      map = new mapboxgl.Map({
        container: this.fullmap.nativeElement,
        style: 'mapbox://styles/.....',
        center: [.....],
        zoom: [....],
        attributionControl: false
      });

    }, 2000);
  }

  ngOnInit() {

  }

}

Ошибка, которую я получаю при обновлении, следующая:

core.js:9110 ERROR TypeError: Cannot read property 'nativeElement' of undefined
    at fullmap.component.ts:50
    at ZoneDelegate.invokeTask (zone-evergreen.js:391)
    at Object.onInvokeTask (core.js:34182)
    at ZoneDelegate.invokeTask (zone-evergreen.js:390)
    at Zone.runTask (zone-evergreen.js:168)
    at invokeTask (zone-evergreen.js:465)
    at ZoneTask.invoke (zone-evergreen.js:454)
    at timer (zone-evergreen.js:2650)

Я пытался с ChangeDetectorEf (еще одна ошибка), изменяя код (внутри ngAfterViewInit, onInit .. ., с помощью EventEmitter из сервиса, когда я получаю сообщения. Я разочарован этой проблемой.