1

您能否看一下This Plunker Demo并告诉我为什么它不起作用？

这是我的代码

<!DOCTYPE html>
<html ng-app>

  <head>
    <script data-require="angular.js@2.0.0-alpha.31" data-semver="2.0.0-alpha.31" src="https://code.angularjs.org/2.0.0-alpha.31/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body>
    <div ng-controller="FirstController">
      <h1>{{msg}}</h1>
    </div>
  </body>

</html>

并在script.js：

var FirstController = function($scope){
    $scope.msg = "This Must Work!";
};
4

3 回答 3

2

您链接到的角度文件 ( https://code.angularjs.org/2.0.0-alpha.31/angular.js ) 无效。所以角度永远不会加载。

于 2015-08-14T17:33:24.300 回答
2

你想使用角度还是角度2？Angular 2 目前处于测试阶段，而不是常用版本。

在角度 1 的情况下，会有一些小错误。

首先，您没有在 javascript 中声明该应用程序。为此，您应该编写如下内容：

var myApp = angular.module('myApp',[]);

然后，您使用了该ng-app指令，但没有为其提供值。它应该与您之前制作的“模块”的值相同（myApp在这种情况下）。

<html ng-app="myApp">

接下来，为了能够在您的应用程序中使用控制器，您必须将其“附加”到您的应用程序。否则，角度不知道它的存在。我们这样做：

myApp.controller('FirstController', ['$scope', function($scope) {
  $scope.msg = 'This Must Work!';
}]);

在这个例子中，我还使用了 angular CDN。

还有一个有效的Plunkr 演示

于 2015-08-14T17:44:47.167 回答
1

您使用的角度参考无效。我使用对 angular 的有效引用来调整代码，它工作正常。此外，您没有正确创建控制器，首先您应该创建一个模块，然后向其中添加一个控制器。这就是“script.js”文件的样子：

var app = angular.module('myApp', []);

app.controller('FirstController', function($scope) {
    $scope.msg = "This Must Work!";
});

这就是具有有效角度参考的更新 html 的样子：

<!DOCTYPE html>
<html>

<head>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src= "script.js"></script>
</head>

<body>
    <div ng-app="myApp" ng-controller="FirstController">  
       <h1>{{msg}}</h1>
    </div>
</body>

</html>

请注意，我还添加了 ng-app="myApp" 以引用创建的模块。希望这可以帮助。

于 2015-08-14T18:07:50.530 回答