Ionic 2 : Refresh tabs view after adding a new dynamic tab

Try triggering change detection manually -

import { Component, NgZone } from '@angular/core';import { Events } from 'ionic-angular';import { DatabaseService } from "../../providers/database.service";import { ItemsPage } from '../items/items';import { ContactPage } from '../contact/contact';import { HomePage } from '../home/home';import { CategoryPage } from '../category/category';@Component({  templateUrl: 'tabs.html'})export class TabsPage {  categories: any = [];  tab1Root = HomePage;  tab2Root = CategoryPage;  tab3Root = ItemsPage;  tab4Root = ContactPage;  constructor(public databaseService: DatabaseService, public events: Events, private ngZone: NgZone) {      this.events.subscribe('category:created', () => {      this.refreshTabs();    });  }  ngOnInit() {    this.refreshTabs();  }  refreshTabs() {    this.databaseService.getCategories().then(categories => {    this.ngZone.run(() => {      this.categories = categories;      console.log(this.categories); // [Object, Object, Object]    });  });  }}

Use this in your constructor to detect change and refresh your page.

constructor(private ref: ChangeDetectorRef){} refreshTabs() {    this.databaseService.getCategories().then(categories => {      this.categories = categories;      console.log(this.categories); // [Object, Object, Object]      this.changeDetectorRef.detectChanges();    });  });  }

refreshTabs() {    this.databaseService.getCategories().then(categories => {      this.categories = categories;      this.categories = [...this.categories]      console.log(this.categories); // [Object, Object, Object]    });}

You can apply this.