Не получаю мои данные в мою угловую директиву

Итак, я читаю файл data.json и пытаюсь заполнить вкладки, используя это. Я смог сделать это без использования пользовательской директивы, но я хочу создать несколько вариантов макетов с помощью директив. Однако я не могу заставить свой ng-repeat работать в файле templates/directives/tabs.html. Вот моя установка. Кроме того, мой $scope.data.data приводит меня к массиву, который я снова смог успешно пройти. Является ли область в директиве другой детализацией, чем в index.html?

index.html детализация выглядит следующим образом: {{data.whatever}} Это то же самое внутри директивы?

.controller('TabController', function($scope, $http, _){
    $scope.model = {};
    $http.get('data.json').then(function(resp) {
    $scope.data = resp.data.data;
})

angular.module('myApp').directive('cmTabs', function() {
    return { 
        restrict: 'A',
        scope: {
            content: '='
        },
        templateUrl: 'templates/directives/tabs.html'
    };
})

});

Моя разметка такая

<!DOCTYPE html>
<html ng-app="myApp" ng-controller="TabController">
    <head>
    <link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.css">
    <title>{{data.PageTitle}}</title>
    </head>
    <body>
        <nav class="navbar navbar-default"><a class="navbar-brand" href="#"><!-- <img alt="Brand" src="..."> -->{{data.PageTitle}}</a>
               <ul class="nav navbar-nav">
                 <li ng-class='{active:$first}' ng-repeat="menu in data.toplevelcontainer" ng-click="model.activeTab=tab" tooltip="{{menu.label}}" tooltip-trigger="mouseenter" tooltip-placement="bottom">
                   <a href="#">{{menu.label}}</a>
                 </li>
               </ul>
        </nav>
        <div class="container-fluid" ng-if="data.Layout === 'tabs'" >
          <div cm-tabs content="data"></div>
        </div>
        <div class="container-fluid" ng-if="data.Layout === 'menu'">
          <h1>menu</h1>
        </div>
        <script src="node_modules/jquery/dist/jquery.js"></script>
        <script src="node_modules/angular/angular.js"></script>
        <script src="node_modules/underscore/underscore-min.js"></script>
        <script src="node_modules/bootstrap/dist/js/bootstrap.js" type="text/javascript"></script>
        <script src="app.js"></script>
        <script>
            $("ul.nav-tabs a").click(function (e) {
                e.preventDefault();  
                $(this).tab('show');
            });</script>
        </body>
        </html>

ДИРЕКТИВА Шаблон

<div class="tabbable boxed parentTabs">
    <div class="tab-content">
        <div class="tab-pane fade active in" id="set1">
            <div class="tabbable">
                <ul class="nav nav-tabs" ng-repeat="t in data.toplevelcontainer">
                    <li ng-class='{active:$first}' ng-repeat="st in t.content.innercontent" data-toggle="tooltip" data-placement="left" title="{{st.tooltip}}"><a href="#{{st.label}}">{{sub_tab.label}}</a></li>
                </ul>
                <div class="tab-content">
                </div>
            </div>
        </div>
    </div>
</div>

angularjs angularjs-directive
person pcproff    schedule 20.10.2015    source источник
comment
Используете ли вы ng-controller в своей разметке?   -  person lintmouse    schedule 20.10.2015
comment
Я действительно являюсь. ‹html ng-app=myApp ng-controller=TabController›   -  person pcproff    schedule 20.10.2015
comment
Можете ли вы опубликовать больше своей разметки, в частности, как content привязывается?   -  person lintmouse    schedule 20.10.2015
comment
Возможно, это просто опечатка в вашем коде вопроса, но ваша функция контроллера не завершена. Вам не хватает })   -  person Phil    schedule 20.10.2015
comment
Привет, Фил, да, это опечатка, я добавлю в пост   -  person pcproff    schedule 20.10.2015
comment
@pcproff Привет, как выглядит ваш шаблон директивы? Я имею в виду, как вы используете свою модель content внутри шаблона своей директивы?   -  person Abhilash Augustine    schedule 20.10.2015
comment
@AbhilashPA Я опубликовал это. Интересно, следует ли мне использовать content.toplevelcontainer?   -  person pcproff    schedule 20.10.2015
comment
@pcproff, да, вы должны использовать content вместо data.   -  person Abhilash Augustine    schedule 20.10.2015
comment
@AbhilashPA такая оплошность!!! Но теперь я знаю, как директивы получают данные. Теперь, чтобы прочитать документы о том, что означает «=»   -  person pcproff    schedule 20.10.2015
comment
@pcproff, могу ли я получить accepted answer, если опубликую этот комментарий в качестве ответа? :)   -  person Abhilash Augustine    schedule 20.10.2015

Ответы (1)


arrow_upward
0
arrow_downward

Вы должны использовать content.toplevelcontainer вместо data.toplevelcontainer.

Потому что вы сопоставляете модель области видимости вашего контроллера data с content в своей директиве. Итак, данные из вашего контроллера теперь назначаются переменной области видимости вашей директивы content.

Итак, ваш ng-repeat должен выглядеть вот так,

<ul class="nav nav-tabs" ng-repeat="t in content.toplevelcontainer">
person Abhilash Augustine    schedule 20.10.2015
comment
Вы совершенно правы! Вот что я сделал! Спасибо еще раз. - person pcproff; 20.10.2015