Skip to main content

ngb-tabset active or select a tab programmatic using Angular

Component.ts:

import {NgbTabset} from '@ng-bootstrap/ng-bootstrap';

@ViewChild('tabs')
  private tabs: NgbTabset;
 
ngAfterViewInit() {    
      this.tabs.select('tab2'); //tab-id
  }



Component.html:

<ngb-tabset #tabs>
<ngb-tab title="tab1" id="tab1">
</ngb-tab>
<ngb-tab title="tab2" id="tab2">
</ngb-tab>
</ngb-tabset>

Labels:

Comments

Post a Comment

Popular posts from this blog

Angular Architecture

  Angular Architecture: Angular is a platform and framework to build single-page client applications using HTML and TypeScript. It is written in Typescript.    The basic building blocks are NgModules. It provides compilation context to components. An angular app has always a root module to enable bootstrapping.                                                               Architectural diagram src: Angular.io   The main building blocks of Angular applications:              Modules              Component             Metadata              Templates              Directives     ...
Post a Comment
Read more

Convert Base64 code to PDF file in Angular

Component.ts: import { DomSanitizer } from '@angular/platform-browser' ; base64Code = 'your base64 code ' ; byteCharacters : any ; pdfUrl : any ; constructor ( public sanitizer : DomSanitizer ) { } convertToPdf () { // tslint:disable-next-line:max-line-length this . byteCharacters = this . base64Code ; // atob() function decodes a string of data which has been encoded using base-64 encoding const byteCharacters = atob ( this . base64Code ); const byteNumbers = new Array ( byteCharacters . length ); for ( let i = 0 ; i < byteCharacters . length ; i ++) { byteNumbers [ i ] = byteCharacters . charCodeAt ( i ); } const byteArray = new Uint8Array ( byteNumbers ); const blob = new Blob ([ byteArray ], { 'type' : 'application/pdf' }); this . pdfUrl = URL . createObjectURL ( blob ); } Component.html: < embed [src] = "sanitizer.bypassSecurityTr...
1 comment
Read more

Observable, Subject , Behavior Subject using RxJS:

  Create an Observable using RxJS:   Import the Observable                                    import  {  Observable  }  from   'rxjs' ; The Observable execution deliver three types of values: "Next" - sends a value such as a Number, a String, an Object, etc. "Error - sends the Error or exception. "Complete" - does not send a value after the Complete                                             ngOnInit ():  void  {                    this . observable$  =  new   Observable ( subscriber   =>  {             ...
Post a Comment
Read more