Question

我无法理解为什么我在控制器中输入的文字没有链接到视图。

我创建了两个javascript文件。 app.js和MainController.js

我遵循Codecademy的教程来复制类似的场景，但我可能会遗漏一些非常简陋的内容，我无法理解这些内容。

以下是我的文件：

的index.html

<!DOCTYPE html>
<html lang="en">

<body ng-app="myApp" ng-controller="MainController">
  <h1>{{title}}</h1>

  <scipt src="js/app.js"></scipt>

  <script src="js/controller/MainController.js"></script>
</body>

</html>

app.js

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

MainController.js

app.controller('MainController', ['$scope', function ($scope) {
    $scope.title = 'Hola!';
}]);

我认为这可能与将我的主控制器放在app.js文件的单独文件中有关。

Answer 1

我认为您没有在主页面中加载Angular（index.html），所以只需添加此行

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

Answer 2

您需要在MainController.js

中引用app变量之前声明它

// MainController.js
var app = angular.module('myApp');

Answer 3

在mainController中

angular.module('myApp').controller(......

Answer 4

你需要向你添加Angular.js ..在app.js之前我认为角度现在没有加载。

的index.html

 <head>
   <title>{{title}}</title>
   <script data-require="angular.js@1.5.0-rc.0"    data-semver="1.5.0-rc.0"    src="https://code.angularjs.org/1.5.0-   rc.0/angular.js"></script>
   <link rel="stylesheet" href="style.css" />
   <script src="app.js"></script>
 </head>

 <body >
   <h1>{{title}}</h1>
   {{1+1}}
 </body>
</html>

app.js

(function() {
 angular.module('myApp', [])
   .controller('mainController', ['$scope', function($scope) {
     $scope.title = 'Hello world!';
   }]);
}())

注意：不要声明变量app，因为它在全局范围内。可被其他东西覆盖的人总是尝试使用IFFE 如果要将服务放在另一个文件中，请将控制器添加到模块中并创建其他模块。

AngularJs Controller未链接到视图

4 个答案: