javascript - 如果我在指令中使用 Controller ，如何从 ng-repeat 接收第一个元素？

Question

我正在尝试使用 ng-repeat 在我的页面上实现选项卡。但我默认无法先显示。这是我的 HTML 代码:

<div ng-show="tab.isSet(project)" ng-repeat="project in projects">
    <img ng-src="{{project.images[0]}}" alt="" class="img-responsive project-img"><br>
    <p>{{project.description}}</p>
    <p ng-show="project.website.page">
        See here: <a href="{{project.website.page}}" target="_blank">{{project.website.name}}</a>
    </p>
</div>

变量projects是一个对象数组。我需要默认显示该项目的第一个。

digitApp.directive('aboutTab', function() { 
  return { 
    restrict: 'E', 
    templateUrl: 'js/directives/aboutTab.html',
    controller  : function () {
                this.tab = 1; // I need to fix this code but I have no idea how
                this.isSet = function (checkTab) {
                    return this.tab === checkTab;
                };
                this.setTab = function (activeTab) {
                    this.tab = activeTab;
                };
    },
    controllerAs: "tab" 
  }; 
});

Answer 1

我还没有测试过这个，但我会尝试做类似的事情:

digitApp.directive('aboutTab', function() { 
  return { 
    restrict: 'E', 
    templateUrl: 'js/directives/aboutTab.html',
    scope: {
        someModel: '=',
        someString: '@',
        someMethod: '&',
        tabIndex: '=',
        isSet: '&',
        setTab: '&'
    },
    controller: function () {
                this.someModel = null;
                this.someString = '';
                this.tabIndex = null;
                this.isSet = null;
                this.toggleTab = function (activeTab) {
                    if (!this.isSet) this.isSet = true
                    else this.isSet = false
                };
    },
    controllerAs: "tab" 
  }; 
});

你可以尝试这样的事情:

<div ng-repeat="project in projects">
    <about-tab ng-show="tab.isSet(project)" someModel="project.someModel" someMethod="project.someMethod(tab.someVar)" someString="{{project.somestring}} can be here" tabIndex="project.index" isSet="false" toggleTab="tab.toggleTab(project.toggle)"></about-tab>
</div>