Navtab active with the angularJS and bootstrap

 Sometimes, navtab works well in angularJs controller but sometimes it will not. Actually, it depends on the attribute that you use to activate navtab.


Here is the sample of code that will hopefully work for every angularJs controller.

<div class="row">
<div class="col-md-12"> 
<div class="card">
<ul class="nav nav-tabs" role="tablist"> 
<li role="presentation" class="active">
<a class="anchor" data-target="#othercity" aria-controls="othercity" role="tab" data-toggle="tab">from city to city</a>
</li>
<li role="presentation">
<a class="anchor" data-target="#withincity" aria-controls="withincity" role="tab" data-toggle="tab">within a city</a>
</li>
</ul>
 <div class="tab-content"> 

<div role="tabpanel" class="tab-pane active" id="othercity"> 
<div class="col-md-4 col-sm-6"> 
<p>Text</p>
</div> 
</div> 

<div role="tabpanel" class="tab-pane" id="withincity"> 
<div class="col-md-4 col-sm-6"> 
<p>Text1</p>
</div> 
</div> 

</div> 
</div>
</div>
</div>


I hope this code snippet will work for you :)

You are awesome!

Comments