在 Angular 7中,我想使用SVG外对象插入一些HTML代码,但是它不起作用。终端报告一个错误。 Angular 无法识别HTML标签
这是代码
<g id="peizhi" (click)="config()" style="width: 110px; height: 30px" transform="translate(181,0)">
<!-- <a (click)="config()" style="width: 110px;height: 30px">-->
<use xlink:href="#Rectangle" x="0" y="0"></use>
<text x="15" y="10" style="fill: rgba(245, 245, 245, 1);width: 24px;height: 27px;" font-size="12px">
配置
</text>
<polygon points="41 0, 47 0, 44 4" fill="rgba(216, 216, 216, 1)"/>
<foreignObject width="100" height="50"
requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility">
<!-- XHTML content goes here -->
<body xmlns="http://www.w3.org/1999/xhtml">
<p>Here is a paragraph that requires word wrap</p>
</body>
</foreignObject>
<!-- </a>-->
</g>
这是错误
ERROR Error: Uncaught (in promise): Error: Template parse errors:
':svg:p' is not a known element:
1. If ':svg:p' is an Angular component, then verify that it is part of this module.
2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. (" <!-- XHTML content goes here -->
<body xmlns="http://www.w3.org/1999/xhtml">
[ERROR ->]<p>Here is a paragraph that requires word wrap</p>
</body>
</foreignObject>
"): ng:///OperateNavModule/EndmonitorNavComponent.html@49:8
':svg:body' is not a known element:
最佳答案
您需要将xhtml命名空间添加到段落中。像这样:
<xhtml:p>Here is a paragraph that requires word wrap</p>
您可以尝试here。
关于angular - 在Angular7中使用SVG foreignObject标签,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/55644019/