AngularJS{{message}}won'；不显示_Angularjs

AngularJS{{message}}won'；不显示

angularjs

AngularJS{{message}}won'；不显示,angularjs,Angularjs,新手到AngularJS。试图在html页面上显示来自控制器的消息，但未显示。我使用的是AngularJS版本1.6.0，我将控制器绑定到body标签。我错过了什么 ///HTML <!DOCTYPE html> <html ng-app="app"> <head> <script data-require="angular.js@*" data-semver="4.0.0" src="https://ajax.googleapis.com/

新手到AngularJS。试图在html页面上显示来自控制器的消息，但未显示。我使用的是AngularJS版本1.6.0，我将控制器绑定到body标签。我错过了什么

///HTML

<!DOCTYPE html>
<html ng-app="app">

<head>
  <script data-require="angular.js@*" data-semver="4.0.0" 
  src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.10/angular.min.js">
  </script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>

<body ng-controller="MainController">
  <h1>{{message}}</h1> 
</body>

</html>

谢谢。

由于您使用的是1.6版，不支持全局控制器声明，因此您还需要一个模块

演示

var-app=angular.module（'testApp'，[]）
应用控制器（'MainController'，功能（$scope）{
$scope.message=“你好，Angular！”；
});

{{message}}
由于您使用的是1.6版，不支持全局控制器声明，因此您还需要一个模块
演示

var-app=angular.module（'testApp'，[]）
应用控制器（'MainController'，功能（$scope）{
$scope.message=“你好，Angular！”；
});

{{message}}
您是否需要在ng app
标签上传递应用程序的名称
像这样：
<html ng-app="your-app">

HTML文件：

{{mainCtrl.message}

为什么？：控制器被构造成“新的”，并提供一个
新实例，并且controllerAs语法更接近
JavaScript构造函数比经典的$scope语法更有效
为什么？：它促进了绑定到视图中“点”对象的使用
（例如，customer.name而不是name），这更符合上下文，更容易
阅读，并避免在没有
“打点”
为什么？：帮助避免在具有嵌套控制器的视图中使用$parent调用

我希望这能帮助您
您是否需要在ng app
标签上传递应用程序的名称
像这样：
<html ng-app="your-app">

HTML文件：

{{mainCtrl.message}

为什么？：控制器被构造成“新的”，并提供一个
新实例，并且controllerAs语法更接近
JavaScript构造函数比经典的$scope语法更有效
为什么？：它促进了绑定到视图中“点”对象的使用
（例如，customer.name而不是name），这更符合上下文，更容易
阅读，并避免在没有
“打点”
为什么？：帮助避免在具有嵌套控制器的视图中使用$parent调用

我希望这对您有所帮助
谢谢您的回复Sajeetharan。我编辑了代码以反映我所做的更改，但它仍然不起作用。我错过了一步吗？这是指向我在Plunker上的代码的链接：@rizzo刚刚更改了app.MainController
在app.controller
code snuppet正在工作，是正确的谢谢Sajeetharan。就这样，谢谢你的休息。我编辑了代码以反映我所做的更改，但它仍然不起作用。我错过了一步吗？这是指向我在Plunker上的代码的链接：@rizzo刚刚更改了app.MainController
在app.controllercode snuppet正在工作，是正确的谢谢Sajeetharan。就这样。
var app = angular.module('testApp',[])
app.controller('MainController',function($scope) {
    var vm = this; // view model
    vm.message = "Hello, Angular!";
});

<body ng-controller="MainController as mainCtrl">
    <!-- or any other name, your choice -->
    <h1>{{mainCtrl.message}}</h1> 
</body>