I'm about to generate different OG tags for item-detail like pages. I use https://github.com/nglibs/meta module for Angular to generate the meta tags for the pages, it's works well on browser, but the Facebook's scraper loading the original index.html file, and shows nothing from the generated tags. As i researched there should be some server side logic to generate the meta tag-s, and not use JavaScript to generate the meta tags, then the Facebook would be able to use the correct meta. Is there any solution for this problem in the MEAN stack? (and then i don't get the point why use @nglibs/meta module to generate og meta tags as they are useless this way)
You can use ejs templating to render index file. like below. For further study in ejs follow this link
<!doctype html>
<html lang="en" xmlns="http://www.w3.org/1999/html">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, maximum-scale=1.0, minimum-scale=1.0, initial-scale=1.0" />
<link href="/css/somecss.css" rel="stylesheet" />
<title>Your site</title>
<meta content="<%- metaTagsDescription %>" name="description" />
<meta content="<%- metaTagsRobots %>" name="robots" />
<meta content="<%- metaTagsKeyWords %>" name="keywords" />
<!-- Facebook meta tags-->
<meta property="og:type" content="<%- metaTagsType %>" />
<meta property="og:title" content="<%- metaTagsTitle %>" />
<meta property="og:image" content="<%- metaTagsImg %>" />
<meta property="og:url" content="<%- metaTagsUrl %>" />
<meta property="og:description" content="<%- metaTagsDescription %>" />
</head>
<body >
<section id="app"></section>
<script src="/bundle.js"></script>
</body>
</html>