如何动态更新离子中的meta标签？

Posted 2023-01-24

在离子项目中，只有一个head部分，我们在其中写入了meta tag页面中的所有index.html。例如，要使Facebook共享正常运行，我们需要给定以下meta tag：

<meta property="og:title" content="Title">
<meta property="og:description" content="description">
<meta property="og:image" content="Image Url you want to show">
<meta property="og:url" content="http://yourUrl.com">

那么我们如何从其他页面更新此元标记？例如，如果我们转到news detail页面，则该页面的meta tag将相应地更改。那么如何在Ionic4中使用角度项目实现这一目标？

答案

我相信您可以用类似的方式做到这一点：

var link = document.createElement('meta');
  link.setAttribute('property', 'og:url');
  link.content = document.location;
  document.getElementsByTagName('head')[0].appendChild(link);