在JSON对象键上使用ng-repeat在md-tabs中生成选项卡

Question

我希望为JSON对象的每个键生成选项卡。选项卡不可见，并且控制台中未显示任何错误。我可以生成一个表，但不能基于键生成选项卡。请告知。

这是小提琴-https://jsfiddle.net/pxa076rs/3/

angular.module('MyApp', ['ngMaterial'])

  .controller('MyCtrl', function($scope) {
    $scope.statuses = JSON.parse({
      "One": "First Tooltip",
      "Two": "Second Tooltip",
      "Three": "Third Tooltip"
    });


  });

HTML

<div ng-app="MyApp">
<div ng-controller="MyCtrl">
<md-content class="md-padding">
  <md-tabs class="" md-selected="selectedTab" md-align-tabs="top" md-border-bottom md-autoselect md-dynamic-height>

    <md-tab ng-repeat="(key, value) in statuses">
      <md-tab-label>
        {{key}}
        <md-tooltip md-direction="bottom">
          {{value}}
        </md-tooltip>
      </md-tab-label>

      <md-tab-body>
        <md-list>
          <md-list-item class="md-3-line" ng-repeat="design in status.designs" ng-click="showDesign(design._id)">
            <img ng-if="design.images[0]" ng-src="{{design.images[0]}}" class="md-avatar" alt="no img" />
            <img ng-if="!design.images[0]" src="https://das4vxwadkuqo.cloudfront.net/missing.png" class="md-avatar" alt="no img" />
            <div class="md-list-item-text" layout="column">
              <h3>{{ design.name }}</h3>
              <h4>{{ design._created_at }}</h4>
              <p ng-bind-html="design.description"></p>
            </div>
          </md-list-item>
        </md-list>
      </md-tab-body>
    </md-tab>

  </md-tabs>
</md-content>
</div>
</div>