how to implement link preview in angularjs

Question

is there any directive in angularjs to implement the link preview in angularjs. I need to show the link preview while sharing a link in my web site similar to google plus.

There is some directive https://github.com/LeonardoCardoso/Link-Preview. But it uses php. I need without php.

Answer 1

If you are using Angular with material design you can use the following:

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

Else you can always do it manually using: Free link preview service

http://linkpreview.net is a Free REST API service which takes any URL as input and sends back JSON response with title, description and thumbnail.

All you need to do is send a request to their API with the URL for which link preview has to be generated.

Here’s an example request (GET)

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

Response:

{
"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/"
}

You can parse the response and style it.