Modern Angular Tabs Component

Author: Jaspero
Publish Date:
Official Page: Go to website
Views Total: 132
License: MIT

Description:

A modern and easy-to-use tabs component implemented for Angular 5+.

Installation:

# Yarn
$ yarn add @jaspero/ng-tabs

# NPM
$ npm install @jaspero/ng-tabs --save

Usage:

Import the ng-tabs into your module.

@NgModule({
    imports: [
        JasperoTabsModule
    ],
    declarations: [AppComponent],
    bootstrap: [AppComponent]
})
export class AppModule {}

Use the component.

<jaspero-tabs>
  <jaspero-tab [tabTitle]="templateRef">Content 1</jaspero-tab>
  <jaspero-tab [tabTitle]="'<p>example 2</p>'">Content 2</jaspero-tab>
  <jaspero-tab tabTitle="example 3">Content 3</jaspero-tab>
</jaspero-tabs>
<ng-template #templateRef>
  <p>This is an example</p>
</ng-template>

Preview:

Modern Angular Tabs Component

Tags:

Leave a Reply