1. Home
  2. Forum
  3. Angular
  4. Create a new tab

Create a new tab

Trying to create a new tab.  I have a tab.component with methods of create tab, that i got from the forums.  Trying to call from another component, but it's complaining about the ComponentFactoryResolver.  Very new to Angular 2.

Any advice?

export class TabComponent {

    
constructor(private resolver: ComponentFactoryResolver) {}

public createNewTab(componentModulePath, tabName, componentInputs) { //rest of code}
}


export class AppComponent {
constructor() {
let TabComponent: test = new TabComponent(); //Can't initialise here, Complains TabControl signature does not match
}
}


1 Reply
GG Gopi Govindasamy Syncfusion Team May 23, 2017 12:01 PM UTC

Hi Sumair,  

We have achieved your requirement for createNewTab called another component in sample page. We have attached code snippet and sample below link.  

Code snippet:  

export class HomeComponent { 
  // tab containers   
  @ViewChild('myTabPanel') gpTabPanel: EJComponents<ej.Tab, any>; 
 
  constructor(private resolver: ComponentFactoryResolver) { 
    this.hiddenTabs = Array<number>(); 
    let a =new TabDataComponent();  
    console.log(a.tab);    // return hello 
  } 
 
  tempTestCounter = 0; 
  onCustomButtonClick(args) { 
    this.tempTestCounter++; 
    this.createNewTab('homeComponent' + this.tempTestCounter, 'test' + this.tempTestCounter, {}); 
  } 
 
 
export class TabDataComponent { 
  public tab:string; 
  constructor() {  
    this.tab = 'hello'; 
 
  } 
} 




Regards, 
Gopi G. 


Loader.
Up arrow icon