Javascript 未加载角度指令html(控制台中无错误)

Javascript 未加载角度指令html(控制台中无错误),javascript,html,angularjs,angularjs-directive,Javascript,Html,Angularjs,Angularjs Directive,因此,我有以下文件夹结构: 我在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

因此,我有以下文件夹结构:

我在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>
我的指令html位于js/modules/Cafe/directives/Cafe-list/Cafe-list.html中

看起来像这样:

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

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

我甚至可以看到指令文件已加载

我怀疑您的指令中可能缺少一个额外的结束div标记。
您也可以尝试使用.directivecafeList,而不是.directivecafeList,但我怀疑这会有什么不同。

我怀疑您的指令中可能缺少一个额外的结束div标记。
您也可以尝试使用.directivecafeList而不是.directivecafeList,但我怀疑这会有什么不同。

您的指令的一个问题是您的指令名为angular,如果您想命名两个单词的指令,那么它应该是“snake case”,它将转换为“camel case”

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

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

指令的一个问题是指令名,如angular,如果您想命名两个单词的指令,那么它应该是“snake case”,这将转换为“camel case”

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

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

尝试将console.log放入controller/link指令中,以查看它是否正确loaded@AlainIb它不运行console.log,但这怎么可能呢?当我可以在我的Source中看到Cafe模块最初声明在哪里时?我看到您有angular.module'Cafe',但它引用了一个现有的Cafe模块。您是否打算使用angular.module'Cafe',[]来代替?该模块在lib/Cafe.js文件中声明。您介意用最初声明Cafe的代码更新您的问题吗?尝试在controller/link指令中放置一个console.log,以查看它是否正确loaded@AlainIb它不运行console.log,但这怎么可能呢?当我可以在我的Source中看到Cafe模块最初声明在哪里时?我看到您有angular.module'Cafe',但它引用了一个现有的Cafe模块。您是否打算使用angular.module'Cafe',[]来代替?该模块在lib/Cafe.js文件中声明,您是否介意使用最初声明Cafe的代码更新您的问题?
// directive
angular.module('Cafe').directive('cafeList', function() {
  return {
    restrict: 'E',
    template: 'js/modules/Cafe/views/cafeList.html'
  }
});

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