Search code examples
angularng2-bootstrap

Include component inside a tab and change style ng2-bootstrap

I have a little doubt, I created a simple tabs using ng2-bootstrap :

tabs.component.html

<div>

      <tabset #staticTabs>
        <tab heading="Home">Home</tab>
        <tab heading="About">About</tab>

      </tabset>

</div>

Now, for example, how can I create a table and a menu inside the first tab? Must I write all in this component (tabs.component.html and tabs.component.ts) or create an other component and put it inside this one(How in this way)?

How can I change the style for the ng2-bootstrap tabs?

Thanks you

Solution

  • Since tabset is a component, you don't have to create your component. You can just use it as is.

    MainPageComponent

    <div>
  <tabset #staticTabs>
    <tab heading="Home">
      <template tabHeading>Home</template>
      // Content of the first type
    </tab>
    ...
  </tabset>
</div>