当前位置: 首页 > 面试题库 >

如何在AngularJS中的所有网页上共享一个公共标题?

翟宏放
2023-03-14
问题内容

我想有一个header.html,它定义我所有网页的标题如何。如何将此header.html插入顶部的其他网页?

可能会有更好的方法来实现要共享的公共标头。由于我仍然认为自己是html的新手(但不适合编程),因此我愿意接受更好的建议。

谢谢。

编辑:有用的答复提到了使用PHP。但是,我使用AngularJS作为前端,而我的PHP后端仅仅是一个纯REST服务器。我更喜欢用AngularJS方式而不是PHP方式。


问题答案:

AngularJS解决方案如下所示:

<!DOCTYPE html>
<html lang="en" ng-app="myApp">
<head>
  <script src='angular.js'></script>
  <script src='main.js'></script>
</head>
<body>
<div ng-controller="HeaderCtrl">
  <div ng-include src="header.url"></div>
  <script type="text/ng-template" id="header.html"></script>
</div>
</body>
</html>

main.js:

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

function HeaderCtrl($scope) {
    $scope.header = {name: "header.html", url: "header.html"};
}

header.html:

<p> Header content goes here </p>

我之所以没有简单地建议诸如以下的解决方案,<divng-include="'header.html'">是为了避免加载标头时出现任何延迟。另外,jQuery也会这样。

<html> 
  <head> 
    <script src="jquery.js"></script> 
    <script> 
    $(function(){
      $("#headerContent").load("header.html"); 
    });
    </script> 
  </head> 
  <body> 
     <div id="headerContent"></div>
  </body> 
</html>

最后,PHP解决方案将如下所示:

<html> 
  <head> 
  </head> 
  <body> 
    <?php include('header.html'); ?>  
  </body> 
</html>

祝你好运学习!



 类似资料:
  • 问题内容: 我有这个: 我将如何完成? 问题答案: 您可以使用Angular Service在多个控制器之间共享变量。 要在独立控制器之间共享数据,可以使用服务。使用需要共享的数据模型创建服务。在相应的控制器中注入服务。

  • 问题内容: 我正在将AngularJS与c#mvc一起使用。我有一个主页,用户可以在其中输入一些数据,并将其传递给第二个模块,在该模块中,我将使用这些数据进行处理和决策。我必须使用第二个模块中第一个模块中输入或更新的数据。有人可以帮我实现这个目标吗? 问题答案: 希望以下实现可以帮助您有所了解。

  • 我有很多表,但它们有共同的自动增量。例如,我创建了我的第一个用户,它的id为1,然后我创建了一条消息,它的id为2,然后我创建了一条对消息的注释,它的id为3,但它的id应该为1,因为我没有任何其他注释或消息 我的用户: 我的信息: 我的评论是: 我将感谢任何帮助。

  • 我将我的网站从本地主机移动到共享主机这一切都很好,但当我将存储的文件直接上传到public\u html时,我需要:类似于public\u html/storage/我尝试使用类似以下内容: 问题仍然存在。 我的控制器: 我的文件夹: 首页/abdoweb/{bmcelaravel} 核心laravel: 首页/{bmce} 非常感谢。

  • 问题内容: 我将Specflow与NUnit和Selenium结合使用,并希望在所有测试中共享驱动程序实例。我可以使用FeatureContext达到功能级别,但是看不到所有测试的任何内容。我知道这可能不是正确的方法,但我想知道是否有办法。 请帮助提供示例。 谢谢 问题答案: 有几种方法可以做到这一点。此页面涵盖了大多数 我个人可能要做的是定义一个类,并在所有Step类的构造函数中都需要该类,然后

  • 我想创建一个随机的int值,在多个类中使用。每次创建这些类的一组新实例时,我都希望对所有这些类使用一个新的随机int值。不过,随机值应该是相同的。 简而言之,我希望创建一个随机索引,并在多个共同生成数据的类中使用。 这个随机值是否应该在堆栈的顶部生成,并在一起工作的每个类中静态调用?