如何在AngularJs 1.x中动态更改元标题，元关键字，元描述？

Question

我计划使用AngularJS 1.x动态更改元标题，Meta关键字和元描述，以反映在Facebook，Twitter，Google Plus和LinkedIn中。

有没有办法动态改变？ 我正在使用REST Api调用。

谢谢，-Venkat

Answer 1

我建议你使用Tristan建议的这个库。 它工作得很好。 并且还与动态表达式兼容。

要更新元标记，您只需在视图中使用以下标记：

<update-title title="A new title"></update-title>
<update-meta charset="ISO-8859-1"></update-meta>
<update-meta http-equiv="Content-Language" content="es"></update-meta>
<update-meta name="description" content="A page specific description"></update-meta>
<update-meta property="og:title" content="Minions"></update-meta>
<update-meta itemprop="description" content="A page specific itemprop description"></update-meta>

您只需使用以下命令安装它：

bower install angular-update-meta

希望它会帮助某人。

Answer 2

使用Angular-update-meta，它将帮助您动态更新元标记。

https://github.com/jvandemo/angular-update-meta

Answer 3

您可以使用ng-bind动态创建任何标记的内容。

例如：

<title ng-bind="pageTitle()"></title>

然后在你的控制器中：

$scope.pageTitle = function () {
    return 'the page title you want to add dynamically';
};

Google现在呈现javascript，因此动态页面标题和元标记将被正确编入索引。

Answer 4

我也遇到了这个问题所以我为此创建了一个库。 你可以在这里查看 。

您可以通过两种方式使用它：

1. 对于您使用ui-router定义的每个州，您可以附加以下自定义数据： simpleSeoTitle ， simpleSeoDescription ， simpleSeoKeywords 。 只要状态处于活动状态，这3个将更改页面的标题，描述或关键字。

2. 它还公开了一个名为simpleSeoService的服务。 此服务有3个属性， title,描述, and关键字`。 这3个被定义为getter和setter 。 当您具有要附加的动态属性时，这些功能非常有用。