angular strap-当ng重复指向新的数组对象时,bs选项卡不能正确刷新



我正在尝试构建一个选项卡集,该选项卡集将使用bs tabs angularstrap指令和ng repeat在用户操作时动态更改(假设最初的选项卡是a、b、c。在某些用户操作中,它应该更改为x、y、z)

我试图通过在用户操作(比如点击按钮)中将ng repeat指向一个新的数组对象来实现这一点。我注意到出现了一个奇怪的行为,而不是刷新选项卡集

我在这个plnkr中重新创建了它,,请看一看

http://plnkr.co/edit/bpKDx56bieIshKaedzv6?p=preview

<!DOCTYPE html>
<html ng-app="angularjs-starter">
  <head lang="en">
    <meta charset="utf-8">
    <title>AngularStrap - Tab directive</title>
    <link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/css/bootstrap.min.css" rel="stylesheet">
    <link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/css/bootstrap-responsive.min.css" rel="stylesheet">
    <link href="//mgcrea.github.com/angular-strap/css/prettify.css" rel="stylesheet">
    <!-- required libraries -->
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/js/bootstrap.min.js"></script>
    <script src="//mgcrea.github.com/angular-strap/js/angular-strap.js"></script>
    <!-- optional libraries -->
    <script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.4/underscore-min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.0.0/moment.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/fastclick/0.6.0/fastclick.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/prettify/r224/prettify.js"></script>
    <link rel="stylesheet" href="style.css">
    <script src="app.js"></script>
  </head>
  <body ng-controller="MainCtrl">
          <div data-fade="1" ng-model="tabs.activeTab" bs-tabs>
            <div ng-repeat="tab in tabs" data-title="{{tab.title}}"><p>{{tab.content}}</p></div>
          </div>
          <button type="button" class="btn btn-primary" ng-click="changeTabs()">Show different set of tabs</button>
  </body>
</html>

查看代码,选项卡指令似乎会观察活动的选项卡值,并使用transclusion仅刷新选项卡内容,而选项卡标题最初仅分配。我认为常规更改标题的唯一方法是创建一个新指令,该指令以常规方式创建一个tab指令,并用新值初始化它。

最新更新