Как получить первый элемент из ng-repeat, если я использую контроллер в директиве?

Question

Как получить первый элемент из ng-repeat, если я использую контроллер в директиве?

0

Я пытаюсь реализовать вкладки на моей странице с помощью 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>

Переменные проекты - это массив объектов. Мне нужно отобразить первый из этого проекта по умолчанию.

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" 
  }; 
});

Sergey Podgornyy 04 окт. 2015, в 19:21

Источник

0

что насчет Tab директивы?
dfsq 04 окт. 2015, в 16:30
0

digitApp.controller ('AboutCtrl', ['$ scope', 'about', '$ location', функция ($ scope, about, $ location) {about.success (function (data) {$ scope.projects = data; });}]);
Sergey Podgornyy 04 окт. 2015, в 16:31
0

digitApp.factory ('about', ['$ http', function ($ http) {return $ http.get ('template / about.json'). success (function (data) {return data;}). error ( function (err) {return err;});}]);
Sergey Podgornyy 04 окт. 2015, в 16:31
0

HTML-код выше расположен в <about-tab> </ about-tab>
Sergey Podgornyy 04 окт. 2015, в 16:33

Показать ещё 2 комментария

Теги:

javascript

angularjs

1 ответ

Ещё вопросы

digitApp.controller ('AboutCtrl', ['$ scope', 'about', '$ location', функция ($ scope, about, $ location) {about.success (function (data) {$ scope.projects = data; });}]);
digitApp.factory ('about', ['$ http', function ($ http) {return $ http.get ('template / about.json'). success (function (data) {return data;}). error ( function (err) {return err;});}]);
HTML-код выше расположен в <about-tab> </ about-tab>

jmunsch · Answer 1 · 2015-10-04T15-20-00.000Z

Я не тестировал это, но я попытался бы сделать что-то подобное:

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>