[英]What's wrong with my Hello World AngularJS app?
This is the code, not sure why it's not working. 这是代码,不确定为什么不起作用。 Got the angular.min.js
file in the same folder as index.html
在与index.html
相同的文件夹中找到了angular.min.js
文件
<!doctype html>
<html lang="en" ng-app>
<head>
<meta charset="utf-8">
<title>Hello World</title>
</head>
<body>
<h1 ng-controller="HelloWorldCtrl">{{helloMessage}}</h1>
<script src="angular.min.js"></script>
<script type="text/javascript">
function HelloWorldCtrl($scope) {
$scope.helloMessage = "Hello World";
}
</script>
</body>
</html>
It's the old syntax to declare controller. 这是声明控制器的旧语法。 Now you can't declare angualar controller as global function and you should use angular.module("appName",[]).controller("CtrlName",function(){});
现在您不能将angualar控制器声明为全局函数,而应该使用angular.module("appName",[]).controller("CtrlName",function(){});
instead. 代替。
Rewrite your script to: 将脚本重写为:
var app = angular.module("myApp",[]);
app.controller("HelloWorldCtrl($scope){
$scope.helloMessage = "Hello World";
}
And change your html file second line to 并将您的html文件第二行更改为
<html lang="en" ng-app="myApp">
Angular is a whole framework and not just a simple call like that. Angular是一个整体框架,而不仅仅是这样的简单调用。 You'll need actually do something like (in a js file usually): 您实际上需要做类似的事情(通常在js文件中):
angular.module("myapp",[]).controller('HelloWorldCtrl', ['$scope', function($scope){
$scope.helloMessage = "hello World";
}]);
and the HTML for it is 和它的HTML是
<!doctype html>
<html lang="en" >
<head>
<meta charset="utf-8">
<title>Hello World</title>
<script src="angular.min.js"></script>
</head>
<body ng-app="myapp">
<h1 ng-controller="HelloWorldCtrl">{{helloMessage}}</h1>
<script type="text/javascript">
angular.module("myapp",[]).controller('HelloWorldCtrl', ['$scope', function($scope){
$scope.helloMessage = "hello World";
}]);
</script>
</body>
</html>
(note this isn't best practices, but to help you get started, reference here for best practice, that i find accurate: https://github.com/johnpapa/angular-styleguide ) (请注意,这不是最佳实践,但是为了帮助您入门,请参考此处以获取最佳实践,我认为这是正确的: https : //github.com/johnpapa/angular-styleguide )
Try this one 试试这个
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="angular.js"></script>
<script type="text/javascript">
angular.module("HelloWorldApp", [])
.controller("HelloWorldController", function ($scope) {
$scope.helloWorld = "Hello World";
})
</script>
</head>
<body ng-app="HelloWorldApp" ng-controller="HelloWorldController">
<h1>{{helloWorld || "undefined"}}</h1>
</body>
</html>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.