假设我正在开发一个PHP应用程序。在网站的某个页面上,有一个复杂的交互式应用程序,我想使用Angular来实现。问题是,我仍然希望该页面的页眉和页脚与网站的其他部分相匹配。我很想能够像这样做:
// main-template.php
<html>
<head>
<title>My Site-wide Header</title>
<script src="site-wide-script.js"></script>
<link href="site-wide-styles.css" rel="stylesheet">
<?php if ($somevar == true) : ?>
<?php echo "Yes, it has to be PHP"; ?>
<?php endif; ?>
</head>
<body>
<header>
<ul>
<li><a href="/home">Home</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact</a></li>
</ul>
</header>
<!-- Drop entire Angular application here -->
</body>
</html>
对我而言,只需使用PHP include
Angular HTML文件就可以实现一定的功能,但这相当不可靠,因为Angular index.html
文件已经包含了html
、body
等标签。当然,我可以DOM解析Angular文件并在包含前修复所有这些问题......但我更喜欢一个更好的解决方案。
在我的搜索中,似乎找不到任何官方推荐的方法来实现这一点。实际上,我似乎找不到任何人使用Angular做类似的事情的例子 - 所有我的搜索结果都是关于使用AngularJS 进行类似操作的。是否有任何可靠的方法可以用Angular完成这个任务呢?
iframe
吗? - user184994iframe
不会尊重内容大小,除非你使用JS,(2)它会隐藏Angular应用程序的URL。 - Peteindex.html
中除了<app-root>
标签以外的所有内容。看起来构建正常。 - user184994index.html
中删除<body>
标签,ng build
就会将脚本标签放在生成的index.html
顶部,导致运行时错误。有没有办法在构建期间自定义插入Angular脚本的位置? - Pete