如何在angularjs中实现链接预览

时间:2016-11-15 23:01:59

标签: angularjs hyperlink

在angularjs中是否有任何指令来实现angularjs中的链接预览。我需要在我的网站上共享链接时显示链接预览,类似于google plus。

有一些指令https://github.com/LeonardoCardoso/Link-Preview。但它使用PHP。我需要没有PHP。

1 个答案:

答案 0 :(得分:0)

如果将Angular用于材质设计,则可以使用以下内容:

https://github.com/angular-material-extensions/link-preview

否则,您始终可以使用以下方法手动进行操作:免费链接预览服务

http://linkpreview.net是一项免费的REST API服务,它将任何URL用作输入,并发送回带有标题,描述和缩略图的JSON响应。

您需要做的就是向其API发送一个请求,其中包含必须为其生成链接预览的URL。

以下是示例请求(GET)

http://api.linkpreview.net/?key=123456&q=https://www.google.com

响应:

{
"title": "Google",
"description": "Search the world's information, including webpages, images, videos and more. Google has many special features to help you find exactly what you're looking for.",
"image": "http://www.google.com/images/branding/googlelogo/1x/googlelogo_white_background_color_272x92dp.png",
"url": "https://www.google.com/"
}

您可以解析响应并设置其样式。