Question

我是angularJS的新手，并试图让以下简单的示例工作。但是当我运行它时，我得到一个空白屏幕，而不是“Hello world”。将非常感谢帮助。感谢。

角comp.js：

  angular.module('myApp').component('greetUser', {
      template: 'Hello, {{$ctrl.user}}!',
      controller: function GreetUserController() {
          this.user = 'world';
      }
 });

的index.html：

<!DOCTYPE html>
<html ng-app="myApp">
<head>
    <meta charset="ISO-8859-1">
    <title>AngularJS</title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js">             </script>
    <script src="js/angularcomp.js"></script>
</head>
<body>
    <greet-user></greet-user>
</body>
 </html>

更新：我发现了问题，版本1.4.5不支持组件。我现在使用1.6.1并且它可以工作!!!!

Answer 1

问题在于

angular.module('myApp')

这应该是

angular.module('myApp',[])

因为你正在创建一个新模块。如果你没有传递第二个数组参数，AngularJS将尝试找到你的模块，而不是创建一个新模块。

试试这个：

<!DOCTYPE html>
<html>

  <head>
    <meta charset="ISO-8859-1">
    <title>AngularJS</title>
  </head>

  <body ng-app="myApp">
    <greet-user></greet-user>
  </body>

  <script>
    angular.module('myApp',[])
      .component('greetUser', {
        template: 'Hello, {{$ctrl.user}}!',
        controller: function GreetUserController() {
          this.user = 'world';
        }
      });

  </script>

</html>

使用angularJS .component（）但没有得到任何值

1 个答案: