Question

我一直在学习angular.js，而且我一直遇到同样的问题。一个简单的问候世界很容易出现：

<body ng-app>
    <h1>Hello, {{name || "World"}}!</h1>
</body>

使用<head>中的正确脚本可以解决这个问题，但是一旦添加了控制器，它就会中断：

<head>
<script type="text/javascript" src="js/angular.min.js"></script>
<script type="text/javascript">
    angular.module("myApp",[]).controller("MainCtrl",[function($scope) {
        $scope.name = "patterson"
    }]);
</script>
</head>
<body ng-app="myApp" ng-controller="MainCtrl">
    <h1>Hello, {{name || "World"}}!</h1>
</body>

这不仅不会使我的名字代替＆＃34; world＆＃34;，它不再评估把手，而是将把手留作原始文本。无论是<head>还是其他文件，都会发生这种情况。如果我删除对ng控制器的引用，则角度再次起作用。无法弄清楚我做错了什么......

以下是两种情况的解释：

https://jsfiddle.net/74t2q2kL/1/

https://jsfiddle.net/74t2q2kL/2/

感谢您的帮助！

Answer 1

这里的语法不正确：

[function($scope) {
        $scope.name = "patterson"
    }]

应该是：

function($scope) {
        $scope.name = "patterson"
    }

方括号[]表示您正在传递一系列事物，在这种情况下您不想这样做。

Answer 2

您没有将$scope注入控制器

angular.module("myApp",[]).controller("MainCtrl",['$scope', function($scope) {
    $scope.name = "patterson"
}]);

Answer 3

如果您使用Controller的方括号格式，则应首先将范围变量传递给字符串，如下所示：

angular.module("myApp",[]).
        controller("MainCtrl",['$scope', function($scope) {
            $scope.name = "Brandon";
        }]);

Answer 4

你的功能声明是错误的。有2个选项。有和没有命名依赖注入。你混合了它们。

选项1：

angular.module("myApp",[]).controller("MainCtrl",function($scope) {
    $scope.name = "patterson"
});

选项2：

angular.module("myApp",[]).controller("MainCtrl",['$scope', function($scope) {
    $scope.name = "patterson"
}]);

当你深入Angular时，这将变得更加清晰。

每次我添加ng-controller，我的应用程序都会中断

4 个答案: