wordpress 更新通过Angular中的“innerHTML”注入的内容

js5cn81o  于 2023-02-18  发布在  WordPress
关注(0)|答案(1)|浏览(163)

我正在开发一个具有以下基础结构的应用程序:

  • 无头WordPress用作主数据库
  • Node.js应用程序用作中间件/后端
  • 前端Angular

我在一种情况下,我需要从WordPress中为一个特定的部分(新闻部分)获取动态内容(类型为"页面"的内容)。
问题是这样的:新闻摘要可以包含导航到网站的某些部分的内部链接。
这些内容一旦到达前端,就通过"innerHTML"属性注入到div中。
现在,我不能直接在来自Wordpress的HTML上添加"routerLink"属性,因为Angular会对它进行清理。
同时,我不想删除清理过程,以避免安全问题。
我尝试通过ViewChild直接在前端添加"routerLink"属性,但是通过"innerHTML"注入的内容似乎是惰性的,不易更新。
有什么办法可以补救吗?
谢谢

8xiog9wr

8xiog9wr1#

尝试向要向其呈现[innterHTML]的元素添加一个(click)事件,捕获该事件并导航到它应该到达的位置。

<div [innterHTML]="data" (click)="elementClicked($event)"></div>
elementClicked($event: any) {
    $event.stopPropagation();
    const target = $event.target || $event.srcElement || $event.currentTarget;

    if (!target) return;
    
    const href = target.attributes.href;

    if (!href) return;
    // if the url is meant to navigate within the app...
    this.router.navigateByUrl(href);
}

相关问题