如何使用单个指令和每个选项卡的自定义标签字段在AngularJS中创建对象驱动的选项卡？

AngularJS主页上的示例使用两个指令创建选项卡：一个用于选项卡，另一个用于窗格。是否可以创建单个模板和单个指令，如下所示：

HTML:

JS:

请看这把小提琴来说明我的问题：

从我到目前为止的理解来看，由于ng repeat是它自己的指令，它会启动并执行自己的操作，我无法访问范围中的object属性，比如说如果我想在指令的链接函数中执行此操作：scope.label=scope.object['scope.labelprop']

---

另外，我仍在努力解决插值、转换等问题，所以解决方案可能会涉及到这一点。

要解决演示中的问题，您可以访问模板中的重复项和指令范围

 <p>{{labelprop}} is  {{object[labelprop]}}</p>

只要vriable在当前范围内，表达式中与筛选器无关但未引用的任何内容都将被视为变量

---

演示：

你试过了吗，我用它来动态生成标签。我显然是个白痴。我一直在想如何做类似object的事情{{labelprop}}，但没有想到尝试object[labelprop]。谢谢。别难过……角度的表达并不总是完全直观的

angular.module('components', []).
directive('tabs', function() {
    return {
        restrict: 'E',
        replace: true,
        scope: {objects: '=', labelprop: '@', shouldbe: '@'},
        controller: function($scope, $element) {
            $scope.someObjects = [
                {name: "One", id: 1, data: 'foo'},
                {name: "Two", id: 2, data: 'bar'},
                {name: "There", id: 3, data: 'foobar'}
                ]
        },
        template:
            '<div class="tabbable">' +
                '<ul class="nav nav-tabs">' +
                    '<li ng-repeat="object in someObjects">' +
                        '<p>How do I use "labelprop" to get {{shouldbe}}</p>' +
                    '</li>' +
                '</ul>' +
            '</div>'
    }
})

 <p>{{labelprop}} is  {{object[labelprop]}}</p>