2

Итак, я хочу, чтобы директива автоматически включала вкладки и содержимое, но я не могу получить содержимое, хранящееся в partials/tabs/tab[x].html.Динамическая включает шаблонную угловую директиву

AvailableTabs - константа, определяемая как массив:

myApp.constant("availableTabs", [ 
    {name:'tab1', title:'One', content:'partials/tabs/tab1.html'}, 
    {name:'tab2', title:'Two', content:'partials/tabs/tab2.html'}, 
    {name:'tab3', title:'Three', content:'partials/tabs/tab3.html'} 
]); 

Моя директива определяет вкладку правильно, чтобы быть включен, и пытается включить содержимое вкладки, а также:

myApp.directive('myTabs',['availableTabs','$templateCache', function(availableTabs, $templateCache) { 
     return { 
      restrict: 'A', 
      template: function (elem, attr) { 
       for (index = 0; index < availableTabs.length; ++index) { 
        if(availableTabs[index].name == attr.myTabs) { 
         return '<tab heading="'+availableTabs[index].title+'" ng-show="1"> ' + 
           '<div ng-include="'+availableTabs[index].content+'"></div>'+ 
          '</tab>'; 
         //return '<tab heading="'+availableTabs[index].title+'" ng-show="1"> ' + 
         // $templateCache.get(availableTabs[index].content)+ 
         // '</tab>'; 
        } 
       } 
      }, 
    }; 
}]); 

Проблема заключается в том, что содержимое вкладки пуст, и у меня нет ошибок.

Мой HTML выглядит следующим образом:

<tabset> 
    <div my-tabs="tab1"></div> 
    <div my-tabs="tab2"></div> 
    <div my-tabs="tab3"></div> 
</tabset> 

Я попытался инъекционного $templateCache в директиве, но она возвращает undefined при извлечении содержимого, я также пытался взять путь относительно пути сценария, но до сих пор undefined.

ответ

1

Потому что вы пропустили ' в ng-include, для передачи имени шаблона как string. Потому что директива ng-include требует ввода string.

ng-include="\''+availableTabs[index].content+'\'" 

будет отображаться как ниже

ng-inlcude="'partials/tabs/tab1.html'" 
+0

Спасибо большое !!! Работала как шарм, ошибок не было, и я не знал, где искать. Я должен подождать 5 минут, чтобы отметить ваш вопрос :) –

+0

@KA_lin, что происходит. в любом случае рад помочь вам .. Спасибо :) –