meta-tags - Angular Meta Service 不添加和更新动态标签值
问题描述
我正在为我的 Angular 6 项目https://mypleaks.com开发 SeoService 。我正在尝试添加和更新 Meta 标签,因为我的内容 URL 会动态更改。
我可以 console.log('18 ' + title); console.log('19' + 描述); 但是当我在 addTag 和 updateTag 标记中附加标题和描述时,只会附加静态值('myPleaks | '),并且可以在检查此链接https://mypleaks.com/#/content/16上的页面源时看到/Manikarnika-Teaser-Launch-Kangana-Ranaut-与女孩一起庆祝-
有人可以告诉我这里有什么问题。为什么元标记没有随着变量的动态值更新。?
export class SeoService {
constructor(public router: Router, public meta: Meta) { }
/**
* updateOgTitle
*/
public updateOgTitleWithURL() {
this.resolveUrl((title: string, description: string) => {
console.log('18 ' + title);
console.log('19 ' + description);
this.meta.updateTag({name: 'title', content: 'myPleaks | ' + title});
this.meta.updateTag({name: 'description', content: description});
this.meta.addTag({property: 'og:title', content: 'myPleaks | ' + title}, true);
this.meta.addTag({property: 'og:description', content: description}, true);
});
}
/**
* resolveUrl
*/
public resolveUrl(cb) {
const state: RouterState = this.router.routerState;
const snapshot: RouterStateSnapshot = state.snapshot;
const url = snapshot.url;
const title = url.substring(url.lastIndexOf('/') + 1, url.length);
cb(title, title);
} }
我也登录到服务器控制台以下,这是否相关..?
headers: HttpHeaders { normalizedNames: Map {}, lazyUpdate: null, headers: Map {} },
status: 0,
statusText: 'Unknown Error',
url: null,
ok: false,
name: 'HttpErrorResponse',
message: 'Http failure response for (unknown url): 0 Unknown Error',
error:
ProgressEvent {
type: 'error',
target:
XMLHttpRequest {
onloadstart: null,
onprogress: null,
onabort: null,
onerror: null,
onload: null,
ontimeout: null,
onloadend: null,
_listeners: [Object],
onreadystatechange: null,
_anonymous: undefined,
readyState: 4,
response: null,
responseText: '',
responseType: 'text',
responseURL: '',
status: 0,
statusText: '',
timeout: 0,
upload: [Object],
_method: 'GET',
_url: [Object],
_sync: false,
_headers: [Object],
_loweredHeaders: [Object],
_mimeOverride: null,
_request: null,
_response: null,
_responseParts: null,
_responseHeaders: null,
_aborting: null,
_error: null,
_loadedBytes: 0,
_totalBytes: 0,
_lengthComputable: false },
currentTarget:
XMLHttpRequest {
onloadstart: null,
onprogress: null,
onabort: null,
onerror: null,
onload: null,
ontimeout: null,
onloadend: null,
_listeners: [Object],
onreadystatechange: null,
_anonymous: undefined,
readyState: 4,
response: null,
responseText: '',
responseType: 'text',
responseURL: '',
status: 0,
statusText: '',
timeout: 0,
upload: [Object],
_method: 'GET',
_url: [Object],
_sync: false,
_headers: [Object],
_loweredHeaders: [Object],
_mimeOverride: null,
_request: null,
_response: null,
_responseParts: null,
_responseHeaders: null,
_aborting: null,
_error: null,
_loadedBytes: 0,
_totalBytes: 0,
_lengthComputable: false },
lengthComputable: false,
loaded: 0,
total: 0 } }
解决方案
推荐阅读
- bash - 带有 -e 和转义字符的多个 sed
- python - “控制器”的实例没有“类型”成员 pynput 模块
- gcc - 尝试在 github repo windows 10 上运行 make 时出错
- python - 如何在循环期间的任何时候检查按键?
- javascript - 一个 href click 和 onClick 同时进行
- spring - 如何在同一个 Spring Boot 应用程序中使用多个“JWK Set Uri”值?
- javascript - Javascript:循环遍历动态生成的标题并截断
- php - 数据未插入数据库(PHP)
- javascript - 如何使用 express 在路由器中连续处理两个斜杠?
- fable-f# - HTML-to-Fable/Elmish 工具的输出是否也适用于 Giraffe 的 ViewEngine?