Question

我创建了没有外部脚本文件的基本示例但是我正在创建演示，我在script.js文件中使用控制器，它无法正常工作。

Html代码：

<!DOCTYPE html>
<html>
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>
  <script src="script.js"></script>
</head>

<body ng-app>
  <div ng-controller="simpleController">
    <strong>First name:</strong> {{firstName}}<br />
    <strong>Last name:</strong> <span ng-bind="lastName"></span><br />
    <strong>Full name:</strong> {{getFullName()}}<br />       
  </div>
</body>
</html>

的script.js

var simpleController = function ($scope)
{
  // Initialize the model variables
  $scope.firstName = "John";
  $scope.lastName = "Doe";

  // Define utility functions
  $scope.getFullName = function ()
  {
    return $scope.firstName + " " + $scope.lastName;
  };
};

控制台出错：

Error: [ng:areq] http://errors.angularjs.org/1.5.7/ng/areq?p0=simpleController&p1=not%20a%20function%2C%20got%20undefined
O/<@https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js:6:412
sb@https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js:22:508
Qa@https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js:23:78
gf/this.$get</<@https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js:89:273


https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js
Line 117

Answer 1

运行以下代码段：

＆＃13;

<com.google.android.gms.plus.PlusOneButton
        android:id="@+id/plus_one_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_below="@id/recommendGooglePlus"
        android:layout_marginStart="16dp"
        plus:annotation="inline"
        plus:size="standard" />

＆＃13;

var app = angular.module("app",[]);
app.controller("simpleController",simpleController);


simpleController.$inject = ["$scope"];
function simpleController ($scope)
{
  // Initialize the model variables
  $scope.firstName = "John";
  $scope.lastName = "Doe";

  // Define utility functions
  $scope.getFullName = function ()
  {
    return $scope.firstName + " " + $scope.lastName;
  };
};

＆＃13;

Answer 2

您应该定义如下的应用

var app = angular.module('app', []);
app.controller('simpleController', simpleController);

var simpleController = function ($scope)
 {
   // Initialize the model variables
   $scope.firstName = "John";
   $scope.lastName = "Doe";

   // Define utility functions
   $scope.getFullName = function ()
   {
     return $scope.firstName + " " + $scope.lastName;
   };
 };

并在index.html中使用此应用

<body ng-app="app">

Answer 3

将此添加到您的代码

var app = angular.module('app', []);
app.controller('simpleController', ['$scope', function($scope){
     $scope.firstName = "John";
     $scope.lastName = "Doe";

     // Define utility functions
     $scope.getFullName = function (){
         return $scope.firstName + " " + $scope.lastName;
     };
}]);

了解更多信息，请阅读dependecy Injection

角度控制器功能未运行，错误：[ng：areq]

3 个答案: