Question

请你看一下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!";
};

Answer 1

您要链接的角度文件（https://code.angularjs.org/2.0.0-alpha.31/angular.js）无效。所以角度从不加载。

Answer 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!';
}]);

我也在这个例子中使用了角度CDN。

工作Plunkr demo

Answer 3

您使用的角度参考无效。我用有效的角度引用调整了代码，它工作正常。此外，您没有正确创建控制器，首先应创建一个模块，然后添加一个控制器。这就是＆＃34; script.js＆＃34;文件应如下所示：

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 =＆＃34; myApp＆＃34;提供对创建的模块的引用。希望这会有所帮助。

简单的角度js不适用于Plunker

3 个答案: