Question

所以我一直在看这个问题太久了。真的希望有人可以帮助我:)我只是想创建一个模块，为AngularJS中的我的网站标题创建一个指令和控制器。我没有收到任何错误，我的代码中的日志也不会显示。这是与标题模块相关的代码：

标题/ 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>

Answer 1

您需要在索引页面中调用app.js和angular.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>

Answer 2

我在你的指令定义上看到一个拼写错误：

应为restrict: "E"，您目前缺少't'

Answer 3

这对我有用。请检查您是否包含所有文件。

<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>

AngularJS模块不起作用

3 个答案: