在文本中找到链接并将其转换为嵌入代码

时间:2018-12-01 20:29:21

标签: javascript angular

我正在与Angular合作研究新闻,公告网站。 我将内容打印为<div [innerHTML]='res.content'></div>。但是内容有youtube链接,并且显示为文本。

我是; 在“ div”元素的内容中,我想确定youtube中的链接并将其转换为“嵌入代码”。

Api的res.content示例;

"<p style=\"text-align: center;\"><strong>test yazıdır.</strong></p>\r\n&nbsp;\r\n\r\n<b> </b>\r\n<h4>project description</h4>\r\nMaturity is required as young people will look to the volunteer (&amp;\r\nstaff in general) as a role model.\r\n<div class=\"clearfix\"></div>\r\n<h4>how to apply</h4>\r\nSend CV and covering letter to <strong>info@galwaysteinerschool.com</strong> and name of sending organisation where applicable\r\n\r\n&nbsp;\r\n\r\n<strong>Son Başvuru Tarihi:</strong> 01/02/2019\r\n\r\n&nbsp;\r\n\r\n&nbsp;\r\n\r\n&nbsp;\r\n\r\nhttps://www.youtube.com/watch?v=sgUVUVY2e-I\r\n\r\n&nbsp;\r\n\r\n&nbsp;\r\n\r\n&nbsp;\r\n\r\n<strong>EVS gönderici kuruluş listesi ve başvuru ile ilgili makalemize ulaşmak için <a href=\"http://www.example.com/agh-avrupa-gonullu-hizmeti-nedir-evs/\" target=\"_blank\" rel=\"noopener\">tıklayınız.</a></strong>\r\n\r\n<strong>Diğer AGH/EVS ilanlarına ulaşmak için <a href=\"http://www.example.com/category/evs-agh-firsatlari/\" target=\"_blank\" rel=\"noopener\">tıklayınız.</a></strong>\r\n\r\n<strong>Motivasyon Mektubu Nasıl Yazılır makalemizi okumak için <a title=\"Motivasyon Mektubu Nasıl Yazılır?\" href=\"http://www.example.com/motivasyon-mektubu-nasil-yazilir/\" target=\"_blank\" rel=\"noopener\">tıklayınız.</a></strong>\r\n\r\n<strong>Blog yazarımız Seher Can’ın Avrupa Gönüllü Hizmeti deneyimi makalesi için <a href=\"http://www.example.com/portekiz-avrupa-gonullu-hizmeti-deneyimi/\" target=\"_blank\" rel=\"noopener\">tıklayınız.</a></strong>\r\n\r\n<strong>Blog yazarımız Emre Gögebakan’ın Avrupa Gönüllü Hizmeti başvuru süreci makalesi için <a href=\"http://www.example.com/evs-arayan-genc/\" target=\"_blank\" rel=\"noopener\">tıklayınız.</a></strong>\r\n\r\n<strong>AGH/EVS mülakatı teknikleri makalemiz için <a href=\"http://www.example.com/agh-mulakati-ve-skype-gorusmesi/\" target=\"_blank\" rel=\"noopener\">tıklayınız.</a></strong>\r\n\r\n<strong>AGH EN ÇOK SORULAN SORULAR VE CEVAPLARI makalemiz için <a href=\"http://example.com/agh-en-cok-sorulan-sorular-ve-cevaplari/\" target=\"_blank\" rel=\"noopener\">tıklayınız.</a></strong>\r\n\r\n<strong>Başarılı Motivasyon Mektubu Teknikleri makalemiz için <a href=\"http://example.com/basarili-motivasyon-mektubu-teknikleri/\" target=\"_blank\" rel=\"noopener\">tıklayınız.</a></strong>\r\n\r\n&nbsp;\r\n\r\n&nbsp;\r\n\r\n<strong>Kaynak:</strong> <a href=\"https://europa.eu/youth/volunteering/project/9729_en\" target=\"_blank\" rel=\"noopener\">https://europa.eu/youth/volunteering/project/9729_en</a>\r\n\r\n&nbsp;\r\n<p style=\"text-align: center;\"><strong>Bu ilan Avrupa Birliği resmi sitesinden duyuru amaçlı kaynak gösterilerek Türkçe diline çevrilmiştir. İlan sorumluluğu example.com sitesinde değildir. Özgeçmiş ve motivasyon mektubu hazırlanması işlemlerinde ÜCRETSİZ olarak kurumumuz destek vermektedir. Kurumumuzun başvurunun olumlu veya olumsuz sonuçlanması konusunda herhangi bir taahhüdü ve etkisi yoktur.</strong></p>";

我应采用哪种方法?怎么办?

  

我想做的就是在文章中找到youtube网址,然后将其自动转换为youtube嵌入代码。

从现在开始谢谢你。

1 个答案:

答案 0 :(得分:0)

您可以使用正则表达式从youtube链接获取视频ID。 然后,您只需将其添加到youtube嵌入链接中即可。

因此,如果您使用正则表达式从以下链接中找到视频链接:

它将返回给您:sgUVUVY2e-I

然后您可以将其插入到嵌入链接中,如下所示:

关于使用正则表达式在文本中查找信息的教程,有很多教程,然后由您自己决定如何布置它。