Как обрабатывать ответ 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>

--- функция javascript для проверки URL ---

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 - это план Text / HTML, то отображался в обычном теге div. Я использовал RegEx, чтобы найти, что FieldValue содержит URL-адрес или нет, но для типов ответа 4 и 5 это не сработало.

используйте ng-if = "islink" внутри тега гиперссылки и ng-hide = "islink" в другом div.

— 02.05.2018 16:14

Получите лучший REST API, который обеспечивает более предсказуемые ответы.

— 02.05.2018 16:18

Предоставленный вами код проверяет, содержит ли текст ссылку, но не извлекает ее из текста. У вас есть метод извлечения? Вы используете в нем одно и то же регулярное выражение?

— 02.05.2018 16:26

javascript html regex angular

02.05.2018 16:00

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

Перейти к ответу Данный вопрос помечен как решенный

Ответы 3

сложно написать регулярное выражение для сложной строки, поэтому сначала упростите его. в вашем случае 4 или 5 вы можете сделать это шаг за шагом, как показано ниже:

удалить тег html
обрезать веревку
используя простое регулярное выражение, чтобы проверить, является ли это URL-адресом.

02.05.2018 16:07

вам нужно добавить ng-show, если это islink внутри тега гиперссылки, и ng-hide, если это ссылка внутри контейнера:

<a ng-href = "value" ng-show = "islink" >{{value}}</a>
<div ng-hide='islink' [innerHtml] = "value">{{value}} </div>

см. этот кусок

02.05.2018 16:58

Ответ принят как подходящий

Решено с использованием

createTextLinks_(text) {
    var container = document.createElement("p");
    container.innerHTML = text;
    var anchors = container.getElementsByTagName("a");
    if (anchors.length>0){
          return text;
    }
    else{
    var plain_text = this.htmlToPlaintext(text);
    return (plain_text || "").replace(/([^\S]|^)(((https?\://)|(www\.))(\S+))/gi,
      function(match, space, url){
        var hyperlink = url;
        if (!hyperlink.match('^https?://')) {
          hyperlink = 'http://' + hyperlink;
        }
        return space + '<a href = "' + hyperlink + '">' + url + '</a>';
      }
    );
  } 
  };

Спасибо всем за ответы :)

07.05.2018 11:02