我正在为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 } }

  ask by Raj Bhatia translate from so

本文未有回复,本站智能推荐:

2回复

如何在Angular2中实现SEO(元标签)(使用Angular通用在服务器端渲染)?

我正在搜索一个关于 SEO 或带有 Angular 2 的 Metatags 的完整示例,使用 Angular 通用在服务器端渲染(被 facebook、twiter 和其他元标签识别),但我没有成功.. 我找到了多篇文章,但有不完整的(没有所有源代码可用)或最旧的(未使用最新版本编译): a)
2回复

Angular5CLI服务器端渲染Webpack问题

我遵循了angular-cli Wiki中的Wiki,进行了Angular 5中的服务器端渲染。 正确执行所有步骤。 我记得它上周工作了。 我没有对系统进行任何更改。 但是昨天,当我尝试相同的步骤npm run build:ssr && npm run serve:s
1回复

在angular中找不到项目名称

我正在尝试将我的角度应用转换为角度通用。 我不断收到错误消息: 在工作区中找不到项目“ my-app”。 当我尝试使用以下方式构建应用程序时: npm run build:client-and-server-bundles && npm run webpack:se
2回复

有没有办法从angular6通用的server.ts文件中的interceptor.service.ts访问变量?

我需要从interceptor.service.ts中将“ this.cacheFlag”变量访问到应用程序根目录中的server.ts文件中。 return next.handle(this.authReq).pipe( tap((event: HttpEvent<any>
1回复

Angular通用服务器端渲染,Meta标签

我将我的网站迁移到 Angular 通用 SSR,在迁移过程中我遇到了一些我认为 ng-universal 可以解决的问题。 我想添加元标记,例如描述、关键字等(每个页面都不同)。 使用 angular 建议的titleService效果很好,它更改了页面的标题。 但是,如果我登陆主页然后从那里导航
1回复

Angular2-是否可以为例如styles.78f022854070df211b2d.css添加绝对路径?

有没有人知道是否可以将绝对路径/域名添加到Angular Universal中的stylesxxxxxx.css的href? 我有:link rel =“stylesheet”href =“styles.78f022854070df211b2d.css” 我想:link rel =“st
1回复

Angular6UniversalwithSSRProduction构建错误

我刚接触Angle 6,我几乎完全完成了我的应用程序,但是我遇到了ssr的一些问题。我按照本教程进行ssr 教程,但是在运行此npm run build时我遇到了构建方面的问题build:ssr && npm run serve:ssr comand我的dist文件夹中有两个文件
1回复

Angular似乎将开发依赖项构建到通用捆绑包中?

我正在使用typegoose来统一我的接口和在约6个应用程序之间共享的数据库模式。 它可以帮助我保持数据结构的一致性。 现在这意味着我的Angular应用程序中的大多数类型/接口都来自外部项目。 因此,我有: 添加为开发依赖项。 一切正常,我什至可以构建,但是当我尝试使用通用构建