NGX-codetab

This is a codetab module and components for Angular projects. Live Demo Here

Badges

Installing / Getting started

To get started using the library install from npm

npm i ngx-codetab --save

This will give you access to the module and components available in the library.

Add module to you NgModule

After installing the library to get access to the features you need to add it to your AppModule.

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { NgxCodeTabModule } from 'ngx-codetab';

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

The inside of you app.component.html you can use the component like so:

<ngx-codetab [language]="html" [content]="<p>Hello World</p>"></ngx-codetab>

If you would like a collection of tabs together simple wrap them in the collection component

<ngx-codetab-collection>
    <ngx-codetab [language]="html" [content]="<p>Hello World</p>"></ngx-codetab>
    <ngx-codetab [language]="js" [content]="console.log('loading...');"></ngx-codetab>
    <ngx-codetab [language]="css" [content]="p { color: blue; }"></ngx-codetab>
</ngx-codetab-collection>

For more information on using this component go to the Documentation and Demo site

Want to Contribute?

Go check out our Contributing Document for more information on getting setup.