AngularJS 模块不工作

AngularJS module doesn't work

所以我已经关注这个太久了。真的希望有人能帮助我 :) 我只是想创建一个模块,为我在 AngularJS 中的站点 header 创建一个指令和控制器。我没有收到任何错误,我的代码中的日志也不会显示。这是与 header 模块相关的代码:

header/header.js

 'use strict';
angular.module('myApp.header', [])

.directive("headerBar", [function(){
  return {
    restric: "E",
    templateUrl: "header/header.html",
    controller: 'HeaderCtrl'
  };
}])

.controller('HeaderCtrl', ['$log', function($log) {
  $log.log('test header controller');
}]);

app.js

angular.module('myApp', [
  'ngRoute',
  'myApp.header'
]).
config(['$routeProvider', function($routeProvider) {
  $routeProvider.otherwise({redirectTo: '/'});
}]);

index.html

<script src="header/header.js"></script>


<header-bar></header-bar>

您需要在索引页中调用 app.jsangular.js 参考脚本

有人认为如下

   //Jquery Scripts
   //Angular.js library scripts 
  <script src="header/header.js"></script>
  **<script src="app.js"></script>**// Please refer here your app.js script



<header-bar></header-bar>

我发现你的指令定义有错别字:

  • 应该是 restrict: "E",您目前缺少 't'

这适用于 me.Please 检查您是否包含了所有文件。

<html>
<head>
  <title>test</title>

  <link rel="stylesheet" href="styles.css">
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
      <script src="header/header.js"></script> 
        <script src="app.js"></script> 
</head>

<body ng-app="myApp.header" ng-controller="HeaderCtrl">
<header-bar></header-bar>

</body>
</html>