Question

我正在使用WAMP，在我的www文件夹下，我有一个名为ng-cribs的文件夹。索引具有以下代码

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.2/angular.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/2.5.0/ui-bootstrap.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/2.5.0/ui-bootstrap-tpls.min.js"></script>
    <script src="app.js"></script>
    <script src="scripts/cribsController.js"></script>
<head>
    <title>ng-cribs</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" integrity="sha384-WskhaSGFgHYWDcbwN70/dfYBj47jz9qbsMId/iRN3ewGhXQFZCSftd1LZCfmhktB" crossorigin="anonymous">

</head>
<body ng-app="ngCribs" ng-controller="cribsController">

    <h1> {{hello}} </h1>

</body>

</html>

然后我在同一文件夹中有一个app.js文件，其中包含以下代码

angular.module('ngCribs, ['ui.bootstrap']);

最后，在一个名为scripts的新文件夹下的一个控制器文件，文件名为cribsController，其代码如下：

angular
.module('ngCribs')
.controller('cribsController'), function(&scope){

    $scope.hello = 'hello world!'

});

但是我的结果是{{Hello}}，而不是显示控制器中的内容

Answer 1

在控制器功能中，必须使用$而不是&。

angular
.module('ngCribs',[])
.controller('cribsController', function($scope){
    $scope.hello = 'hello world!'
});

Answer 2

您应该声明如下语法

angular
.module('ngCribs').controller('cribsController', ['$scope', function($scope) {
   $scope.hello = 'hello world!'
}]);

代替

angular
.module('ngCribs')

导致在不声明其依赖关系的情况下关闭控制器，并且注射。

.controller('cribsController'), function(&scope){

    $scope.hello = 'hello world!'

});

控制器未读取Angular JS

2 个答案: