我的 Angular 页面上有两个 Bootstrap 选项卡,如下所示:
<div>
<ul class="nav nav-tabs">
<li class="active strong">
<a data-target="#home" data-toggle="tab">Tab 1</a>
</li>
<li class="strong">
<a data-target="#pairs" data-toggle="tab">Tab 2</a>
</li>
</ul>
<div id="myTabContent" class="tab-content">
<div class="tab-pane fade in active" id="home">
<div ng-include="partial_1.html"></div>
</div>
<div class="tab-pane fade" id="pairs">
<div ng-include="partial_2.html"></div>
</div>
</div>
</div>
两个部分都在 partial_X.html 中定义了自己的控制器。这两个选项卡有自己的数据和业务逻辑,但如果用户在第二个选项卡上更改服务器上的数据,则应从服务器重新加载第一个选项卡的内容(或至少在用户转到第一个选项卡时)。
单击选项卡时,当然不会发生重新加载,因为控制器已经实例化。只有当控制器再次初始化时,页面上的浏览器刷新后才会重新加载数据。
单击 Tab 1 时有没有办法重新加载控制器?我也可以将两个子控制器组合成一个,但这对于我的问题来说听起来像是一个肮脏的解决方法。