我对Angular非常新,而且仍然是Javascript的新手。我按照教程,但结果不适用于我的项目。
教程:http://toddmotto.com/ultimate-guide-to-learning-angular-js-in-one-day
HTML
<!DOCTYPE html>
<html ng-app="soCLean">
<head></head>
<body ng-controller="soCleanLandingPage">
<div>
<p>{{locale}}</p>
<p>{{type}}</p>
<p>{{service}}</p>
<p>{{serviceSingle}}</p>
</div>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular.min.js"></script>
<script>
var soClean = angular.module('soClean', []);
soClean.controller('soCleanLandingPage', ['$scope', function ($scope) {
$scope.locale = 'vancouver';
$scope.type = 'residential';
$scope.service = 'pressure washing';
$scope.serviceSingle = 'pressure wash';
}]);
</script>
</body>
</html>
我已从上面的代码示例中删除了所有额外的东西,但我应该建议我也从Google CDN中提取两个字体和jQuery,并且有几个本地jQuery插件。
我也在使用一些外部CSS文件。整个页面可以在here找到。
PLease帮助我理解我做错了什么以及为什么这不起作用。感谢。
答案 0 :(得分:6)
这是一个套管问题。将ng-app attr修复为“soClean”而不是“soCLean”。
http://plnkr.co/edit/ASWTQK9M4LfEhlpsbG9y?p=preview
<!DOCTYPE html>
<html ng-app="soClean">
<head></head>
<body ng-controller="soCleanLandingPage">
<div>
<p>{{locale}}</p>
<p>{{type}}</p>
<p>{{service}}</p>
<p>{{serviceSingle}}</p>
</div>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular.min.js"></script>
<script>
var soClean = angular.module('soClean', []);
soClean.controller('soCleanLandingPage', ['$scope', function ($scope) {
$scope.locale = 'vancouver';
$scope.type = 'residential';
$scope.service = 'pressure washing';
$scope.serviceSingle = 'pressure wash';
}]);
</script>
</body>
</html>