fulls1z3 / ngx-meta

Dynamic page title & meta tags utility for Angular (w/server-side rendering)
MIT License
333 stars 47 forks source link

Not fetching meta tags in web master #188

Closed aminsmartsense closed 5 years ago

aminsmartsense commented 5 years ago

Package.json "@ngx-meta/core": "^7.0.0", "@angular/cli": "^6.2.1", "typescript": "^2.9.2"

I have added meta tags in my project. When I am showing code using inspect element on that time all tags are showing but whenever I am open source code in new tab in that meta tags are not displaying. And also in my web master not fetching meta tags.

I have added code like this: In my main module,

export function metaFactory(): MetaLoader {
  return new MetaStaticLoader({
    pageTitlePositioning: PageTitlePositioning.PrependPageTitle,
    pageTitleSeparator: ' - ',
    applicationName: '',
    defaults: {
      title: '',
      keywords: '',
      description: '',
      'og:title': '',
      'og:image': '',
      'og:url': '',
      'og:type': '',
      'og:description': ''
    }
  });
}
imports: [
    MetaModule.forRoot({
      provide: MetaLoader,
      useFactory: (metaFactory)
    }),
  ],

In my routing file

path: '',
    canActivateChild: [MetaGuard],
    children: [
      {
        path: StudentRouteConstants.LANDING,
        component: LandingComponent,
        data: {
          meta: {
            title: StudentSEO.LANDING_TITLE,
            keywords: StudentSEO.LANDING_KEYWORDS,
            override: true,
            description: StudentSEO.LANDING_DESCRIPTION,
            'og:title': StudentSEO.LANDING_DESCRIPTION,
            'og:url': StudentSEO.LANDING_URL,
            'og:image': StudentSEO.META_URL,
            'og:type': 'website',
            'og:description': StudentSEO.LANDNIG_OG_DESCRIPTION
          }
        }
      },

meta1 meta2

Help me what I missing and what is the issue exactly? I am not getting meta tags in web master.

fulls1z3 commented 5 years ago

in order to get meta tags visible (on the page source), you must use server-side rendering.

https://medium.com/burak-tasci/angular-4-with-server-side-rendering-aka-angular-universal-f6c228ded8b0