Question

编辑：我发现了问题。谢谢大家指出他们！：）

我对angularjs有点新意。现在，我的ng-view和ng-include正在工作，但我的控制器却没有。他们之前在工作，但我无法弄清楚为什么这不起作用。

我在Mac上开发，使用safari进行测试。（出于安全考虑，Chrome在本地开发时不起作用）。

当我将它们分成不同的文件时，控制器停止工作。

的index.html

<html ng-app="socialApp">
<head>
    <script src="assets/jquery/jquery.js"></script>
    <script src="assets/bootstrap/js/bootstrap.min.js"></script>
    <script src="assets/angular/angular.min.js"></script>
    <script src="assets/angular/angular-route.js"></script>
</head>

<body>
    <div ng-include="'partials/header.html'"></div>
    <div ng-view></div>
    <script src="config.js"></script>
</body>

header.html中

<div ng-controller="HeaderController">

{{header}}
</div>

headerController.js

var socialApp = angular.module('socialApp', []);
socialApp.controller('HeaderController', function($scope) {
  $scope.header = 'Hello World!';
});

Answer 1

而不是：

  when('/friends', {
    templateUrl: 'partials/friends.html',
    controller: 'controllers/siteController.js'
  })

您可能需要写下这个：

  when('/friends', {
    templateUrl: 'partials/friends.html',
    controller: 'FriendsController'
  })

此外，您还需要在html文件中链接控制器的所有js文件。

而且，您应该只使用angular.module(MODULE_NAME, [DEPENDENCY_MODULES, ...])创建一次socialApp模块。在以后的文件中，当您需要使用它时，只需通过angular.module(MODULE_NAME)获取引用。

Answer 2

每次执行此操作：

var socialApp = angular.module('socialApp', []);

您正在宣布一个新模块（并吹走之前的声明）。您的应用程序代码只需执行一次，我建议将其保留在config.js

中

在您希望使用该模块的所有其他javascript文件中，您可以像这样访问它：

var socialApp = angular.module('socialApp');

注意细微差别。删除Array参数会告诉Angular检索模块，而不是定义新模块。

Answer 3

我在电话上，所以我可能错了，但是......我没有看到你在你的html文件中包含sitecontroller.js和headercontroller.js。我看到只包含配置文件。

Angularjs控制器不起作用

3 个答案: