如何用angular函数显示HTML？

在Angular中，可以使用innerHTML属性来显示HTML内容。以下是一个简单的示例：

首先，在Angular组件的HTML模板中，添加一个元素，用于显示HTML内容：

<!-- app.component.html -->
<div [innerHTML]="htmlContent"></div>

在组件的TypeScript文件中，定义一个变量htmlContent，并将其值设置为要显示的HTML字符串：

// app.component.ts
import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  htmlContent = '<h1>Hello, World!</h1><p>This is a paragraph.</p>';
}

这样，当Angular渲染组件时，htmlContent变量中的HTML字符串将被插入到<div>元素中，并显示在页面上。

需要注意的是，使用innerHTML时要小心，因为它可能会导致跨站脚本攻击（XSS）。确保你渲染的HTML内容是安全的，或者使用Angular的内置管道（如DomSanitizer）来清理不安全的HTML。

参考链接：