Having performance issues due to slow data rendering with each tab using a partial view. The code snippet for each tab is as follows:
<div class="tab-content" ng-controller="MyController">
<div id="tab-1" class="tab-pane fade active in " ng-include="'PartialViews/1.html'"></div>
<div id="tab-2" class="tab-pane fade" ng-include="'PartialViews/2.html'"></div>
<div id="tab-3" class="tab-pane fade" ng-include="'PartialViews/3.html'"></div>
<div id="tab-4" class="tab-pane fade" ng-include="'PartialViews/4.html'"></div>
<div id="tab-5" class="tab-pane fade" ng-include="'PartialViews/5.html'"></div>
</div>
A recommendation was made to use ngIf by wrapping the inner content into a separate partial and ngInclude. This approach prevents unnecessary loading and evaluation of partials when the condition is false from the outset.
I want to implement an ng-if condition based on the active tab (the active tab has the class "tab-pane fade active in"). I'm struggling to figure out how to include a class name-based expression inside ngIf. Any assistance would be greatly appreciated.