如何在 Angular 指令中使用 <head> 标签

Posted 2023-03-06

技术标签:

【中文标题】如何在 Angular 指令中使用 <head> 标签【英文标题】：How to use <head> tag with Angular directive 【发布时间】：2014-05-28 12:33:14 【问题描述】：

我在我的 Angular 应用程序中尝试了this，但它不起作用。所以我尝试在头部插入一个自定义标签（<mytag>），并通过将“head”替换为“mytag”来使指令与它一起工作。

但这并不是我真正想要的，因为它将<mytag> 添加到正文而不是<head>

有谁知道如何让它与 head-tag 一起工作？

【问题讨论】：

【参考方案1】：

我也有同样的挑战。确保您的 Angular 应用程序已在 html 标记上初始化。然后这个解决方案开箱即用。

但是对我们来说这不是一个理想的解决方案。所以我修改了 Zack Boman (tennisgent) https://github.com/tennisgent/angular-route-styles 代码，这样它就可以在应用程序初始化后的任何地方使用。

将指令重命名为：zbRouteStyles 修改了限制以包含属性：restrict: 'EA' 换行：elem.append($compile(html)(scope)); 到 angular.element('head').append($compile(html)(scope));

通过这些更改，我能够在我的 Angular 应用程序初始化后将指令添加到任何标签，甚至是我的应用程序初始化的标签。

例如：

<div ng-app="myApp" zb-Route-Styles> <div>

【讨论】：

合并您在 Github 上的拉取请求后，此 routeStyles 开箱即用。谢谢！

以上是关于如何在 Angular 指令中使用 <head> 标签的主要内容，如果未能解决你的问题，请参考以下文章