2016-04-26 111 views
0

我刚开始Angularjs工作,当我来到了NG-控制器,还有一个令人困惑的问题如下:
的HTML代码:
NG控制器:angularjs的控制器的基本用法,无法正常工作。

<html lang="en" ng-app="App" ng-controller="AppCtrl"> 
<head> 
<meta charset="utf-8"> 
<link rel="stylesheet" href="css/bootstrap.min.css"> 
<title></title> 
<script type="text/javascript" src="js/angular.min.js"></script> 
<script type="text/javascript" src="js/controller.js"></script> 
</head> 
<body> 
<div class="container"> 
<div class="page-header"> 
<h2>Chapter1 <small>Hello,World</small></h2> 
</div> 

</div> 
<div class="container"> 
<div class="jumbotron"> 
<h1>Hello, {{name}}</h1> 
<label for="name">Enter Your Name</label> 
<input type="text" ng-model="name" class="form-control input-lg" id="name"> 
</div> 
</div> 
</body> 
</html> 

的angularjs代码:

function AppCtrl($scope){ 
    $scope.name = "World"; 
}); 

的结果是{{名}}模型部分不能得到正确的数据。没有默认数据“世界”可以显示,无论我在输入文本框内输入什么,输出视图总是你好{{name}}

编辑:我指的是一本关于angularjs的书。演示案例显示我在这里发布的用法。但我现在找到了解决方法。

+0

在浏览器上报任何JavaScript错误(例如,您的浏览器开发人员工具“控制台”选项卡)? –

回答

4

您的Angular不是自举的。使用:

angular.module('App', []) 
    .controller('AppCtrl', function($scope) { 
     $scope.name = "World"; 
    }); 

我建议你先阅读一些基本的教程。

检查这个工作演示:JSFiddle

+0

我知道你回答的方式。但我正在阅读一本书,因为它说只是基于我在这里发布的内容,应用程序可以通过...... –