Question

我正在为每个标签使用如下所示的局部视图。每个局部视图都有很多数据绑定，所以现在数据渲染变慢。

<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>

在此链接中，它被提及为

"One approach to using ngIf is to wrap the inner content into a separate partial and ngInclude. If the ngIf condition is false at the outset, then the included partial will not be loaded and evaluated, which will definitely remove its contribution."

所以我想使用基于活动选项卡的ng-if条件（活动选项卡将使用“tab-pane淡出活动”类）。所以我需要基于类名的ng-if条件。（即ng-if类名是“tab-pane fade active in”“）但我没有得到如何在ng-if中包含基于类名的表达式。请帮忙。

Answer 1

您已经为＃tab-content分配了一个控制器。我建议您添加一个范围变量来跟踪哪个视图处于活动状态，然后您可以使用ng-if或ng-switch来仅包含必要的视图。

使用ng-click设置模型（如果导航位于另一个控制器下，则通过服务传递）或附加routeParameter并使用它设置“activeTab”范围变量。

具有类名条件的ng-if条件

1 个答案: