如果我给 ng-app 和 ng-controller 赋值，AngularJs 不起作用答案

【问题标题】：AngularJs doesn't work if I give a value to ng-app and ng-controller如果我给 ng-app 和 ng-controller 赋值，AngularJs 不起作用
【发布时间】：2017-04-09 15:30:55
【问题描述】：

我希望你能帮助我。我对 Angular 很陌生，所以我可能会犯一些愚蠢的错误，但是，当给 ng-app 赋值时，AngularJs 不起作用。我在这里举个例子：这是我的 home.html 不起作用（当我说“不起作用”时，我的意思是我看到打印的“{{name}}”而不是它的值）。

<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
<script>
var req={
        method: 'POST',
        url: 'http://localhost:8080/ConnectionDb/WebAppDbServlet',
        data: {"nome":$scope.name}
    }
    var app=angular.module('noteApp', [])
    app.controller('noteCtrl', function ($scope, $http){
        $scope.addNote = function () {
            $http(req).success(function(data, status, headers, config) {
                $scope.nome = data;
            }).error(function(data, status, headers, config) {

            });
        }
    })
</script>
</head>
<body ng-app="noteApp">
    <div ng-controller="noteCtrl">
        <form>
            <div>
            Insert your name: <input type="text" name="name" data-ng-model="name"><br>
            </div>
        </form>
        <p>Hola {{name}}</p>
    </div>
</body>
</html>

但如果我这样改变它

<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
<script>
var req={
        method: 'POST',
        url: 'http://localhost:8080/ConnectionDb/WebAppDbServlet',
        data: {"nome":$scope.name}
    }
    var app=angular.module('noteApp', [])
    app.controller('noteCtrl', function ($scope, $http){
        $scope.addNote = function () {
            $http(req).success(function(data, status, headers, config) {
                $scope.nome = data;
            }).error(function(data, status, headers, config) {

            });
        }
    })
</script>
</head>
<body ng-app>
    <div>
        <form>
            <div>
            Insert your name: <input type="text" name="name" data-ng-model="name"><br>
            </div>
        </form>
        <p>Hola {{name}}</p>
    </div>
</body>
</html>

一切顺利。有什么建议吗？

【问题讨论】：

$scope.nome = 数据；它应该是名字
是的，我知道...我实际上只是在这里写错了，但在我的代码中是正确的...它也不起作用。

标签： angularjs ng-app

【解决方案1】：

在您看来，您使用的是{{ name }}，但在控制器内部，您将数据放入$scope.nome。

只需更改$scope.nome > $scope.name

【讨论】：

【解决方案2】：

您正在使用$scope.name 设置req 变量，但此时未定义范围。如果你打开控制台，你会看到一个错误。试试这个：

http://plnkr.co/edit/LqZNX8BYnCnbUD29YRfi?p=preview

<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
<script>
var req={
        method: 'POST',
        url: 'http://localhost:8080/ConnectionDb/WebAppDbServlet',
    }
    var app=angular.module('noteApp', [])
    app.controller('noteCtrl', function ($scope, $http){
        $scope.addNote = function () {
            req.data={"nome":$scope.name}; 
            $http(req).success(function(data, status, headers, config) {
                $scope.name = data;
            }).error(function(data, status, headers, config) {

            });
        }
    })
</script>
</head>
<body ng-app="noteApp">
    <div ng-controller="noteCtrl">
        <form>
            <div>
            Insert your name: <input type="text" name="name" data-ng-model="name"><br>
            </div>
        </form>
        <p>Hola {{name}}</p>
    </div>
</body>
</html>

错误的变量名称（“nome”而不是“name”）与您的问题无关，但仍需要更正

【讨论】：

来了！非常感谢！
不客气。如果对你有帮助记得采纳答案
哦不，等等...这是假的，对不起。我只是在我的浏览器上重试，它没有去
这解决了您的错误：plnkr.co/edit/LqZNX8BYnCnbUD29YRfi?p=preview 您的代码中可能还有其他问题，但可能需要另一个问题
这个好像可以，但是如果我把脚本写在一个外部的js文件里就不行了

【解决方案3】：

在“var app=angular.module('noteApp', [])”之后缺少一个“;”，因此 noteApp 没有被初始化。

【讨论】：