md-tabs

Native Angular2 Material Tabs component

Installation

npm install --save md-tabs

API

Example:

<md-tabs selectedIndex="0">
 <md-tab label="title1">Test content 1</md-tab>
 <md-tab label="title2">Test content 2</md-tab>
 <md-tab>
   <template md-tab-label>Test content 3</template>
   Test content 3
 </md-tab>
</md-tabs>

//app-module.ts

import {MdTabsModule} from 'md-tabs/tabs';

@NgModule({
 imports: [
   MdTabsModule,
 ],
 declarations: [
   ...
 ]  
})

//component.ts
...

@Component({
   selector: "..."
})

export class ... {
   
   ...

}

Properties of md-tabs

• selectedIndex (?number=0) - Index of the active/selected tab.
• class (?string='') - To set custom class on md-tabs element.

Properties of md-tab

• label (?string='') - Optional attribute to specify a simple string as the tab label.
• active (?boolean='false') - To set as an active a tab.
• disabled (?boolean='false') - To set as an disabled a tab.
• class (?string='') - To set custom class on md-tab element.

Events

• change - it fires after a tab has been changes; returns object of selected tab.