首页 > 解决方案 > 如何处理 Rest API 响应可能是任何值,因为值可能内容纯文本、HTML、Url、Angular 2 中的超链接

问题描述

响应类型:

 1. "FieldValue" : "java is platform independent language"
 2. "FieldValue" : "<div>java is platform indepnedant language</div>"
 3. "FieldValue" : "https://www.oracle.com/index.html"
 4. "FieldValue" : "<div>https://www.oracle.com/index.html </div>"
 5. "FieldValue" : "<div> java is platform independent language for more info please visit https://www.oracle.com/index.html </div>"

---角度代码---

<div *ngIf='isLink;else other_content'>
  <a [innerHtml]="news.FieldValue" target="_blank ">{{news.FieldValue}}</a>
</div>
<ng-template #other_content>
  <div [innerHtml]="news.FieldValue">{{news.FieldValue}}> </div>
</ng-template>

---检查URL的javascript函数---

if(new RegExp("([a-zA-Z0-9]+://)?([a-zA-Z0-9_]+:[a-zA-Z0-9_]+@)?([a-zA-Z0-9.-]+\\.[A-Za-z]{2,4})(:[0-9]+)?(/.*)?").test(news['FieldValue']))
{
      this.isLink = true;      
}

我想要如果 FieldValue 是链接或 URL,那么它是可点击的并在新选项卡中打开链接,如果 FieldValue 是计划文本/HTML,则显示在普通的 div 标签中。我使用 RegEx 来查找 FieldValue 是否包含 URL,但对于 4 和 5 响应类型它不起作用。

标签: javascripthtmlregexangular

解决方案


复杂的字符串很难写正则表达式,所以先简化一下。在您的情况 4 或 5 中,您可以按以下步骤逐步进行:

  1. 移除 html 标签
  2. 修剪字符串
  3. 使用一个简单的正则表达式来检查它是否是一个 URL。

推荐阅读