Question

 <html>
  <script src="angular.min.js" type="text/javascript"></script> 
  <body ng-controller="firstController">
   <div ng-app="">
        FirstName <input type="text"  ng-model="first"/>
        LastName <input type="text"  ng-model="last"/>
        Welcome {{first + " " + last}} 
   </div>
   <script>        <!-- script for the controller
        function firstController($scope){
         $scope.first="HELLO";
         $scope.last="ALL";
        }
   </script>
  </body>
 </html>

运行此代码后，我得到两个带空字符串的文本框（文本框中没有“HELLO”和“ALL”）如果我在文本框中写任何内容，它会与'Welcome'一起出现。如果我在ng-app之后放置ng-controller它也不会工作。< / p>

我从一些教程中复制了这段代码。它适用于他们。请帮我弄清楚我的错误。

Answer 1

脚本在页面加载后运行。将<script>移到身体外<script src="angular.min.js" type="text/javascript"></script>下方。这样，脚本将在之前执行，绑定可能会起作用。

编辑：

另外：您的应用应该在您的控制器之外（ng-app应该在ng-controller之前）因为控制器是应用程序的一部分。

在函数声明之后（在JS中）需要以下内容：

var app = angular.module('',[]);//This string must match the value of ng-app
app.controller('firstController',firstController);
//This string has to match the value of ng-controller.

Answer 2

您需要使用ng-init在页面加载时调用该方法，如此

<body ng-controller="firstController" 
      ng-init="firstController()">

Answer 3

首先：我认为您的ng-controller必须在您的ng-app范围内。

第二：尝试像这样定义你的模块和你的控制器：

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<html ng-app="myApp">  
  <body>
   <div ng-controller="firstController">
        FirstName <input type="text"  ng-model="first"/>
        LastName <input type="text"  ng-model="last"/>
        Welcome {{first + " " + last}} 
   </div>
   <script>        
      var app = angular.module("myApp", []);

      app.controller("firstController", function($scope) {
          $scope.first="HELLO";
          $scope.last="ALL";
      });
   </script>
  </body>
 </html>

＆＃13;

Answer 4

试试这段代码

 <html>
 <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
 <div ng-app="myApp" ng-controller="myCtrl">
	First Name: <input type="text" ng-model="first"><br>
	Last Name: <input type="text" ng-model="last"><br>
	<br>
	Welcome: {{first + " " + last}}
</div>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.first= "HELLO";
    $scope.last= "ALL";
});
</script>
</html>

在angularjs中默认不获取初始值

4 个答案:

试试这段代码