提问人：Kyle Vassella 提问时间：11/12/2022 最后编辑：Kyle Vassella 更新时间：11/12/2022 访问量：37
异步引入的 HTML 会继承我们 Angular 应用程序的 <head> 和 <meta> 标签的属性吗？
Will HTML pulled in asynchronously inherit the attributes of our Angular app's <head> and <meta> tags?
问：
在 Angular 应用程序中，我们的 index.html 文件有一个设置字符集的标签：<head>
<head>
<meta charset="utf-8">
</head>
当用户访问某个页面时，该页面的组件会进行 API 调用以获取一些包装在标签中的 HTML，并且该 HTML 通过属性绑定异步加载到模板中，例如<div>[innerHTML]
<div [innerHTML]="myHTMLfromApi"></div>
该数据会继承我们在 index.html 的元标记中设置的 utf-8 字符集（和其他内容）吗？还是为时已晚，因为该 head 标签和应用程序的其余部分已经呈现？
答：
0赞
Ariel Gueta
11/12/2022
#1
我不是 Angular 开发人员，但 javascript 和 html 应该是相同的。
因此，假设我们尝试使用 innerHtml。
首先，html 标签需要通过角度html_sanitizer这意味着一些标签被丢弃。
如果我们尝试将标签注入到 body 标签中，如下例所示：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document1</title>
</head>
<body>
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document2</title>
<script>
console.log('test');
</script>
</head>
<body></body>
</html>
</body>
</html>
和 标签消失，元数据不会被覆盖（标题保持不变）。htmlbodyhead
元数据标签留在体内，这不好。
如果我们把 innerHtml 带到 html 标签外面：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document1</title>
</head>
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document2</title>
<script>
console.log('test');
</script>
</head>
<body></body>
</html>
<body>
</body>
</html>
heads标签合并为单个head标签，第二个标签位于first标签的下方（此处的标题也未更改）。headhead
因此，由于标题在上面的示例中没有更改，因此我假设它继承了元数据，并且如果任何新元数据以某种方式进入 html，则它不会覆盖现有元数据。
评论