2016-06-04 2 views
1

Так я иметь следующую структуру папок:Угловая директива HTML не загружается (без ошибок в консоли)

enter image description here

Я aded следующее моей index.html:

<script type="text/javascript" src="js/modules/App/lib/App.js"></script> 
<script src="js/modules/Cafe/lib/Cafe.js"></script> 
<script src="js/modules/Cafe/directives/cafe-list/cafe-list.js"></script> 

И моя директива выглядит примерно так:

angular.module('Cafe').directive("CafeList", function() { 
    return { 
     restrict: "E", 
     templateUrl: 'js/modules/Cafe/directives/cafe-list/cafe-list.html', 
     link: function (scope, element, attr) { 

     } 
    }; 
}); 

my directive html (находится в js/modules/Cafe/directives/cafe-list/cafe-list.html

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

<div class="one-half-responsive"> 
<div class="service-column material-box"> 
    <img src="images/pictures/3s.jpg"> 

    <h3>Mobile and Tablet</h3> 
    <em>responsive and ready</em> 

    <p> 
     All your mobile devices are compatible with material, and it will look gorgeous on your whatever 
     handheld you use! 
    </p> 

    <div class="more"> 
     <a class="more-link" href="#">READ MORE</a> 
    </div> 
</div> 

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

<div> 
    <cafe-list></cafe-list> 
</div> 

Когда я запускаю это я не получаю никаких ошибок в консоли и все я получаю в html тег <cafe-list> </cafe-list> нет внутренний html

Может ли кто-нибудь увидеть, что я сделал неправильно?

мой App модуль:

/** 
* Created by root on 6/3/16. 
*/ 
angular.module('App',[ 
    'ngRoute', 
    'Cafe' 
]). 
config(['$locationProvider', '$routeProvider', 
    function config($locationProvider, $routeProvider) { 
     $routeProvider. 
     when('/', { 
      templateUrl: 'js/modules/Cafe/views/cafeList.html' 
     }). 
     when('/phones/:phoneId', { 
      template: '<phone-detail></phone-detail>' 
     }). 
     otherwise('/phones'); 
    } 
]); 

и на моем HTML: <html ng-app="App"> кафе модуль, расположенный в ('Js/модулей/Кафе/Библиотека/Cafe.js')

angular.module('Cafe', []); 

Я даже вижу, что файл директивы загружен!

+0

попытка поставить console.log внутри директивы управления/связи, чтобы увидеть, если он будет загружен – AlainIb

+0

@AlainIb оно не запустить console.log(), но как это может быть? когда я могу видеть в моем источнике –

+0

Где первоначально был объявлен модуль 'Cafe'? Я вижу, что у вас есть 'angular.module ('Cafe')', но он ссылается на существующий модуль 'Cafe'. Возможно, вы имели в виду 'angular.module ('Cafe', [])' вместо этого? – Lex

ответ

3

Я подозреваю, что в вашей директиве может отсутствовать дополнительный тег закрытия div. Вы также можете попробовать .directive("cafeList", вместо .directive("CafeList",, но я сомневаюсь, что это будет иметь значение.

1

Один из вопросов с директивой - это название вашей директивы, как в угловом, если вы хотите назвать двухглавую директиву, то это должно быть в «случае змеи», которое переводится в «случай верблюда».

// directive 
angular.module('Cafe').directive('cafeList', function() { 
    return { 
    restrict: 'E', 
    template: 'js/modules/Cafe/views/cafeList.html' 
    } 
}); 

// call directive 
<cafe-list></cafe-list>