AngularJS Bootstrap-ui 选项卡以引入动态内容

Question

我在这里设置了一个 Plunker 来演示我的应用程序：

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

<tabset>
  <tab ng-repeat="tab in tabs" heading="{{tab.title}}" select="getContent()" active="tab.active" disabled="tab.disabled">
  <div ng-hide="!tabs.isLoaded">
  <h1>{{tab.title}}</h1>
    <div ng-repeat="item in tabs.content">
      <p>{{item}}</p>
    </div>
  </div>
  <div ng-hide="tabs.isLoaded"><h3>Loading...</h3></div>
  </tab>
</tabset>

我想做的只是在每个选项卡下显示相关内容，目前我的设置方式是在两个选项卡中提取所有内容。

最好的配置方法是什么？

提前致谢！

Answer 1

改变这个 $scope.tabs.content=res.data;

至

$scope.tabs.content=res.data[0].fruit;

这是更新的 plunker

http://plnkr.co/edit/5Ng9PHkrluKUSzQhor34?p=preview

AngularJS Bootstrap-ui 选项卡以引入动态内容

AngularJS Bootstrap-ui tabs to pull in dynamic content

arrays

ajax

json

angularjs