更新

Question

我想学习AngularJS以在JSF页面中使用。这纯粹是学习目的。我尝试在jsf中添加AngularJS代码。但似乎它没有识别AngularJS代码。它只是在浏览器中输出相同的My first expression: {{ 5 + 5 }}。

我的jsf页面

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js">    
    </script>

    <body>
      <div ng-app="hi" >
         <p>My first expression: {{ 5 + 5 }}</p>
      </div>

    </body>

</html>

任何人都可以帮我解决如何在jsf页面中获取AngularJS表达式的输出吗？或告诉我一些方向

更新

我的目的是从Managebean或另一个jsf页面获取一些json并在此处填充。但为了测试，我试图创建一个虚拟的json结构。但仍然jsf无法识别AngularJS组件。它只是打印我的第一个表达：{{5 + 5}} 浏览器控制台打印MyFirstAng.xhtml:24 Uncaught TypeError: app.conntroller is not a function

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<body>
<div ng-app="myAPP" ng-controller="customerctrl">    
<p>My first expression: {{ 5 + 5 }}</p>

<!-- <ul>
<li ng-repeat="x in myData">
{{x.Name + ', ' + x.Age}}
</li>
</ul>
 -->

 </div>    
</body>    
<SCRIPT type="text/javascript">

    var app = angular.module('myAPP',[]);
     app.conntroller('customerctrl', function($scope){

      // $scope.myData=[{Name:'jani',Age:'32'}];
     });

 </SCRIPT> 
</html>

Answer 1

好的，我发现了这个问题。这是app.controller中的拼写错误。我输入了额外的＆＃34; n＆＃34;。有效。感谢所有人到目前为止指导我发现问题。我以为我错过了包含一些AngularJS库或其他东西。

Answer 2

为了使angular ng-app="hi"初始化，需要存在具有该名称的模块。否则，您应该会在浏览器开发工具控制台中看到异常。开发javascript应用时请注意控制台错误

包含具有该名称的模块或从属性中删除名称，然后使用ng-app

Answer 3

粘贴此

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

在您的脚本中

或制作ng-app="" ...您的选择。如果您在ng-app中指定了任何内容，那么您必须按照我的说明制作一个模块。否则，不要在ng-app中指定任何内容，即ng-app=""。在稍后阶段，当你想制作一个控制器时，你就可以制作一个模块。现在它最好留空。

如何在jsf页面中使用AngularJS

更新

3 个答案: