Angular 2+:如何从HTML代码中删除所有角度属性和注释(以及其他角度工件)? [英] Angular 2+: how to remove all angular attributes and comments (and other angular artifacts) from the HTML code?
问题描述
我想以一种不太普通的方式利用Angular.我用它来生成HTML，以后可用于各种需求.
I want to utilise Angular in a not really usual way. I use it to generate the HTML that is later on used for various needs.
为什么?我希望这个HTML是静态的，并且与角度无关.例如.如果我更改我的应用程序，例如重构代码，生成的HTML应该是相同的(当然，如果背后的逻辑是相同的)，而_ngcontent-cXXX变量和使用ngif/ngfor的注释实际上是取决于应用程序的版本/结构，这是不可能的.换句话说，HTML生成函数应该是确定性的.
Why? I want this HTML to be static and independent from angular. E.g. if I change my app and e.g. refactor the code the generated HTML should be the same (of course if the logic behind is the same) which is not possible with _ngcontent-cXXX variables and comments with ngif / ngfor that really depend on the version / structure of the app. In other words, the HTML generation function should be deterministic.
问题是生成的HTML并不是很干净.例如
Problem is that the generated HTML is not really clean. E.g.
<p _ngcontent-c8="">
Hello
<!--bindings={
"ng-reflect-ng-if": "false"
}-->
blabla
<!--bindings={
"ng-reflect-ng-if": "false"
}-->
ciao
</p>
如何摆脱所有这些属性/注释/等等? Angular是否向我们提供了一些实用程序/服务来清理HTML字符串?
How to get rid of all those attributes / comments / etc? Does Angular provide us with some utilities / services to clean up the HTML string?
HTML缩小器/替换功能将是一种简单易行的方法，但是我真的希望这件事依赖于某些Angular标准功能.
HTML minifier / replace function would be a simple-and-dirty way to go here but I really want this thing to be relying on some of the Angular standard functionalities.
推荐答案
您必须使用整洁.
Tidy可以选择去除不在白名单上的属性并删除注释，但这是一个库，必须在字符串或文本文件上运行.
Tidy has options to strip attributes that aren't on a white-list and also remove comments, but it's a library and has to be run on a string or text file.
Tidy可以通过不同的平台(如PHP，NodeJS或.NET)运行.这是一个NodeJS库:
Tidy can be run via different platforms like PHP, NodeJS or .NET. Here's a NodeJS library:
https://github.com/vavere/htmltidy
另一种选择是使用jQuery使用宽泛的$('*').each()更新DOM，并仅在将HTML保存到所需位置之前对DOM元素进行变异.
Another option would be to use jQuery to update the DOM using a broad $('*').each() and just mutate the DOM elements before saving the HTML to where you need it.
这篇关于Angular 2+:如何从HTML代码中删除所有角度属性和注释(以及其他角度工件)?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
