javascript - AngularJS 错误加载 Controller

标签 javascript angularjs

我有一个非常愚蠢的问题,但我不知道如何解决它。我有这个加载了 AngularJS 的 index.html 文件。我正在使用 Plunker 来测试代码:

<!DOCTYPE html>
<html ng-app="">

  <head>
    <script data-require="angular.js@1.4.8" data-semver="1.4.8" src="https://code.angularjs.org/1.4.8/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-controller="BodyController">
    <h1>{{ message }}</h1>
  </body>

</html>

这个 script.js 文件包含以下信息:

var BodyController = function($scope) {
  $scope.message = "Hi Angular!"
}

在检查器中它说:

Error: [ng:areq] Argument 'BodyController' is not a function, got undefined

脚本已加载。我已经在 J​​S 文件中定义了 Controller 并附加了 ng-controller 指令,所以我不知道这会在哪里失败。

最佳答案

这很basic的 AngularJS。

您首先需要创建一个 module :

var fooApp = angular.module("foo", [])

然后,在那里注册你的 Controller :

var BodyController = function($scope) {
  $scope.message = "Hi Angular!"
}
fooApp.controller("BodyController", BodyController);

并且,在您的 HTML 标记中,像这样更改您的 ng-app:

<html ng-app="foo"></html>

关于javascript - AngularJS 错误加载 Controller ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35080163/

相关文章:

javascript - 如何衡量我的应用程序在 React Native 中的数据使用情况?

html - 需要的消息显示在带有 ui-select2 的页面顶部

angularjs - 发送请求而不在 Angular js中添加 header

javascript - 将模板与 Controller 结合起来

ajax - 在 angular.js 中的 Controller 之间共享变量

javascript - ESLint "no-implicit-globals"规则被忽略

javascript - 如何将 php 关联数组中的值推送到 jquery 数组?

javascript - 如何使用loopback 4执行post请求

javascript - 如何更改动态表中的特定图像?

javascript - Angularjs 深度链接到视觉内容(如模态)