fulls1z3/ngx-meta

Dynamic page title & meta tags utility for Angular (w/server-side rendering)

ngx-meta's Issues

og:url doesn't get rendered correctly using redirectTo

I'm submitting a ... (check one with "x")

[X] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior
@nglibs/meta renders og:url of the redirection origin.

Expected/desired behavior
The url of redirected destination must be rendered.

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

is it possible to dynamically set in ngAfterContentInit hook?

I'm submitting a ... (check one with "x")

[ ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[X ] feature request

Current behavior

If I set in ngOnInit works server-side rendering works, but not in the ngAfterContentInit hook.

Expected/desired behavior

Server side rendering works when set in ngAfterContentInit

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

I've kind of got a weird situation where I am trying to extract info from child content and then set SEO data accordingly. @ContentChild becomes available after the ngAfterContentInit hook

Please tell us about your environment:

Latest seed code on Windows

• Angular version: 2.0.X

Latest seed code version

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

Chrome browser

• Language: [all | TypeScript X.X | ES6/7 | ES5]
  Latest seed code version

• Node (for AoT issues): node --version =

remove `lodash` dependency

I'm submitting a ... (check one with "x")

[ ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[X] feature request

Current behavior
lodash offers great functionality as well as several errors causing a lot of effort to solve - especially with types (#38). Furthermore, it increases the bundle size (50KB~500KB).

Expected/desired behavior
Get rid of lodash, do not depend on it!

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

dynamic og:title angular2

Dear support,

When i using browser that very google (show title), but i using share link facebook, this can't read metadata my site.

Please help me,
Thanks.

updateLocales method does not clear `og:locale:alternate` tags

I'm submitting a ... (check one with "x")

[X] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior
The updateLocales method of MetaService is invoked, it removes the first occurrence of meta tags with the og:locale:alternate property. The second and further meta tags having og:locale:alternate property keep existing, as a result wrong og:locale:alternate are generated.

Expected/desired behavior
When the updateLocales method is invoked, all meta tags with the property og:locale:alternate should be cleared first, and then rewritten upon the current locale.

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

combine with ng2-translate

I'm submitting a ... (check one with "x")

[ ] bug report => check the README and search github for a similar issue or PR before submitting
[x] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Hi, I want to combine ng2-metadata with ng2-translate. Their TranslateService#get(key: string|Array<string>, interpolateParams?: Object): Observable<string|Object> is async. What i came up with is a MetadataResole class that looks like this:

@Injectable()
export class MetadataResolve implements Resolve<any> {
  constructor(private translate: TranslateService, private metadataService: MetadataService) {
  }

  resolve(route: ActivatedRouteSnapshot) {
    return this.translate.get((route.data as any).m3tadata.title).toPromise().then(v => {
      this.metadataService.setTitle(v);
    });
  }
}

and is being used like this:

  {
    path: 'signup',
    component: SignupC,
    canActivate: [LoggedOutG],
    data: {m3tadata: {title: 'AUTH.SIGNUP_P.TITLE'}},
    resolve: {metadata: MetadataResolve}
  },

Now, this is working. But it looks ugly, do u know of any better way? @fulls1z3

no .js files after installing from npm's registry

Hey again @fulls1z3, sorry i deleted the issue template

so today i wanted to give another shot to the new meta lib (still using your old one 💃 ), but now i ran into another weird problem.

Check this screenshot: http://imgur.com/a/i8Vcs

There is no *.js or *.ts file under ./node_modules/@nglibs/meta . Something fishy must be going on in the .npmignore or in the build process.

the latest published version on npm's registry atm is 0.2.0-rc.2

t

I'm submitting a ... (check one with "x")

[ ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior

Expected/desired behavior

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

readme

...
import { MetadataLoader, MetadataStaticLoader, PageTitlePositioning, MetadataService } from 'ng2-metadata';
...

Need import MetadataModule.

set meta tags thru `MetaGuard`

I'm submitting a ... (check one with "x")

[ ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[X] feature request

Current behavior
As of 1ff82a2, @nglibs/meta works both on client and server platforms. Also, the meta tags generated by @nglibs/meta are fully SEO-friendly (visible on the HTML source). However, the meta tags are not fully visible using a callback function (ex: ngx-translate).

Expected/desired behavior
We must provide full SEO-friendliness on meta tags. The following steps will maintain the desired functionality:

• Abandon traversing routes to seek meta information
• Introduce a generic route guard (MetaGuard)
• Append route guards to route configuration dynamically (fails angular-cli due to #15305, #4541)
• Provide documentation for the use of MetaGuard

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

no exported member meta when aot compiler

I'm submitting a ... (check one with "x")

[x ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior

when im making aot compiler using angular-cli this error comes up
ERROR in F:/zeina/rb2000_angular/rb2000/node_modules/@ngx-meta/core/src/meta.service.d.ts (1,10): Module '"F:/zeina/rb2000_angular/rb2000/node_modules/@angular/platform-browser/index"' has no export
ed member 'Meta'.

im using angular 2 v 2.4.10

so how can i solve this problem ?

Expected/desired behavior

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

metas set only via the router definition does not get crawled correctly by facebook, while the programmatically set does

I'm submitting a ... (check one with "x")

[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior
So this is a bit of a weird one, but it appears that any metas set via the router definition does not get crawled, despite them being set and appearing in the html. If I set them programmatically, they work.

Expected/desired behavior
Regardless of how you define the metas the crawler should be able to read them properly.

Minimal reproduction of the problem with instructions
Define title and description in router, while having a p tag with a text in that same router component template. Then use https://developers.facebook.com/tools/debug/sharing/ to crawl it (cannot be localhost) and you will see that the p tag acts as the description instead of the og:description tag for example. This is down to facebook picking the first p tag when it cannot find a description meta.

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X
  2.3.1

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]
  all

• Language: [all | TypeScript X.X | ES6/7 | ES5]
  all

• Node (for AoT issues): node --version =
  6.7

please bundle for webpack

meta data readable by Facebook/Twitter?

Can facebook/twitter bots read meta data as of now with latest angular i see the meta service introduced.

facebook for example cannot read the OG Tags

I'm submitting a ... (check one with "x")

[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior

Expected/desired behavior

Facebook is not recognising the settee OGP tags.

Minimal reproduction of the problem with instructions

Tried already some stuff but did not get it to work, like adding this to my head tag <head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# article: http://ogp.me/ns/article#">

Can it be because it's loaded later? If Facebook, Twitter and other sites cannot read the OG tags?

Having this tags inside my head:

<meta property="og:title" content="Productname · Websitename"><meta name="description" content="description comes here.">
<meta property="og:description" content="Site description comes here.">
<meta property="og:image" content="http://test.com/assets/images/logo.png">
<meta property="og:type" content="website">
<meta property="og:locale" content="nl_NL">
<meta property="og:locale:alternate" content="en_US">
<meta property="og:url" content="http://test.com/product/2x-bsecret-honing-bal"></head>

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

MacOSX, IIS

• Angular version: 2.0.X

CLI 24

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

Chrome, Safari

• Language: [all | TypeScript X.X | ES6/7 | ES5]
  Typerscript

• Node (for AoT issues): node --version = 6.9.1

default meta not set

I'm submitting a ... (check one with "x")

[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior
I've copied

MetaModule.forRoot({
    provide: MetaLoader,
    useFactory: (metaFactory)
})

metaFactory function as well from readme. Meta/title is not set, only if I change it via MetaService. Is it a bug or am I doing something wrong ?

Expected/desired behavior

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 4.1.3

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

rename to `@ngx-meta/core`

I'm submitting a ... (check one with "x")

[ ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[X] feature request

Current behavior

Expected/desired behavior

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

setting og:locale tag without specifying default og:locale throws error

I'm submitting a ... (check one with "x")

[X] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior
@nglibs/meta throws error while setting og:locale tag without specifying default og:locale at the loader settings.

Expected/desired behavior
Given og:locale must be rendered without defaults and without default og:locale at the loader settings.

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

support AOT

During compilation to AOT appears following error:

Error: Error encountered resolving symbol values statically. Function calls are not supported. Consider replacing the function or lambda with a reference to an exported function...

where are old versions

Which commit number was version 0.2 rc4. This version worked just fine for me, with 0.4rc1 I have problem with AoT compilation and lodash. It is a bad practice to unpublish old versions from npm.

view page source

If I check a page as "View page source" the title is the original from the main index.html and the description is empty. However, if I inspect the page, the title and the description will load the data as in the component in the inspector. However, I'm not sure after the page is crawled will read the correct title and description, because seems injected instead of rendered.

Is there a solution for this?

I'm using the structure of quickstart tutorial from angular 2 - Mac mini - osx sierra. - Chrome v55

refreshing page doesn't set the title or description that's defined in the router

I'm submitting a ... (check one with "x")

[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior
If I go from page 1 to page 2, the metas are set correctly, but if I go from page 1 to page 2 and then refresh on page 2, page 2's metas aren't being set.

Expected/desired behavior
I expect the page 2's metas to be set on refresh as well.

Minimal reproduction of the problem with instructions
See current behavior.

• Angular version: 2.0.X
  2.3.1

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]
  all

• Language: [all | TypeScript X.X | ES6/7 | ES5]
  all

• Node (for AoT issues): node --version =
  6.7

depend on Angular 2.0.0

I'm submitting a ... (check one with "x")

[ ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[X] feature request

Current behavior
@nglibs/meta depends on Angular 2.4.0

Expected/desired behavior
It should depend on Angular 2.0.0

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

prevent direct DOM manipulation

I'm submitting a ... (check one with "x")

[ ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[X] feature request

Current behavior
@nglibs/meta is currently touching the DOM directly.

Expected/desired behavior
For master, better use Meta (@angular/platform-browser) and for v0.2.x implement DomAdapter instead of manipulating the DOM.

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

remove `[].slice.call(elements)`

I'm submitting a ... (check one with "x")

[ ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[X] feature request

Current behavior
The fix for TypeError: Object doesn't support property or method 'forEach'" issue on IE11 has already been covered by Meta/MetaHelper.

Expected/desired behavior
The fix can be removed from the source code, as it has already been covered on a higher level.

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

can't setTitle() from .component

I'm submitting a ... (check one with "x")

[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior

Only setTag() works on a component. setTitle() doesn't set any title, even if true is added as a second parameter. It simply ignores, and fallbacks to the default title set in app.module.

Expected/desired behavior

Being able to set the title from a component.

Minimal reproduction of the problem with instructions

Angular app is composed of a bootstrapping app.module, which is then divided in pages.module (composed of multiple blocks, ie: about-page), and blocks.module (composed of multiple HTML elements, ie: slideshow-block).
Followed the README.md.

Please tell us about your environment:

• Angular version: 2.4.7

• Browser: [all]

• Language: [TypeScript 2.1.6]

• Node (for AoT issues): node --version = 7.4.0

work with ngx-translate >= v7.x

I'm submitting a ... (check one with "x")

[ ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[x ] feature request

The whole reason I want to use this if it works with ngx-translate, I use angular universal instead. I want to see if I can use dynamic translate in meta and title tags.

doesnt seem to work with lazy load routes e.g. loaded Children

Doesnt seem to work with lazy load routes e.g. loaded Children.

Eg:
{path: 'createJob', loadChildren: 'app/components/createJob/createJob.module#CreateJobModule'},

Google still picks up the homepage only.

support Promises at the `callback` function

I'm submitting a ... (check one with "x")

[X] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior
@nglibs/meta does not support passing callback function with Promise return type.

Expected/desired behavior
It should support Promise as a valid return type.

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

og:locale insists to remain default when @nglibs/i18n-router is used

I'm submitting a ... (check one with "x")

[X] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior
@nglibs/meta does renders the default og:locale when @nglibs/i18n-router is used.

Expected/desired behavior
Given og:locale must be rendered.

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

support for multiple `og` properties with the same key

I'm submitting a ... (check one with "x")

[ ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[X] feature request

Current behavior
@nglibs/meta does support multiple og properties with the same key.

Expected/desired behavior
It should support multiple og properties with the same key.

For example:

<meta property="og:image" content="http://example.com/rock.jpg" />
<meta property="og:image:width" content="300" />
<meta property="og:image:height" content="300" />
<meta property="og:image" content="http://example.com/rock2.jpg" />
<meta property="og:image" content="http://example.com/rock3.jpg" />
<meta property="og:image:height" content="1000" />

Could have been provided by @nglibs/meta

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

support for canonical tags

Hi,

How do I make the canonical tag change. I've got the title, description and keywords changing ok.

Do I simply do this:

 {
    path: 'home',
    component: HomeComponent,
    data: {
      meta: {
        title: 'Home page',
        description: 'Description of the home page', 
        canonical: 'mywebsite.com/home' 
      }
    }
  }

I'm using angular version 4, with webpack, typescript and ng2-meta plugin. I just need to make the canonical tag change in runtime like the description changes. Is this possible?

use universal methods to manipulate the HTML element

I'm submitting a ... (check one with "x")

[ ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[X] feature request

Current behavior
In @nglibs/meta v0.2.0-rc.5, manipulating the HTML element (to set the lang attribute) has been commented out, in scope of preventing direct DOM manipulation.

Expected/desired behavior
We need to set the lang attribute of HTML element, using universal methods as they become available.

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

source metadata not changing ?

Hi,

I've just installed the ng2-metadata package really easily.
Thanks for your work !

I checked the metadata in my head element and everything is fine.
The problem is in my source code, the metadata are the default one..

It is an expected behaviour ?

use gutil instead of console in gulp tasks

I'm submitting a ... (check one with "x")

[ ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[X] feature request

Current behavior
During code review, console seems as an unexpected statement.

Expected/desired behavior
console should be replaced by gutil.

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

programmatically updating title or tags works inside ngOnInit, but not within subscribe callback function.

I'm submitting a ... (check one with "x")

[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior

Neither this.meta.setTag('description', 'updated description'); or this.meta.setTitle('updated title'); seem to work inside of a subscribe function of an http request to a REST API.
Expected/desired behavior

It should use the default values of the metaService as defined here: https://github.com/nglibs/meta#appmodulets-2
until the http request finishes and the subscribe function is called, then it should use the updated data as defined by the setter functions.
Minimal reproduction of the problem with instructions

Follow the above description

What is the motivation / use case for changing the behavior?

I have data from the server that needs to be put into the meta and title tags for better seo with Google.
Please tell us about your environment:

• Angular version: 2.0.X

angular-cli: 1.0.0-beta.26
node: 6.9.3
os: darwin x64
@angular/common: 2.4.5
@angular/compiler: 2.4.5
@angular/core: 2.4.5
@angular/forms: 2.4.5
@angular/http: 2.4.5
@angular/material: 2.0.0-beta.1
@angular/platform-browser: 2.4.5
@angular/platform-browser-dynamic: 2.4.5
@angular/router: 3.4.5
@angular/compiler-cli: 2.4.5

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]
  TypeScript
• Node (for AoT issues): node --version =

no refresh method in MetaService

I'm submitting a ... (check one with "x")

[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior

I found this.meta.refresh(); in readme. But there is no refresh method in MetaService delaration.

Expected/desired behavior

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 4.1.3

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

cannot read property 'Injectable' of undefined

I'm submitting a ... (check one with "x")

[ x ] bug report => check the README and search github for a similar issue or PR before submitting
[ x ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior

Expected/desired behavior

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.4.4

• Browser: [all ]

• Language: [TypeScript 2.1.5]

• Node (for AoT issues): node --version = 7.2.1

When start my app, in console next error

Uncaught TypeError: Cannot read property 'Injectable' of undefined
at eval (eval at webpackJsonp.308.module.exports (addScript.js:9), :1:6388)
at Object.t.AppendPageTitle (eval at webpackJsonp.308.module.exports (addScript.js:9), :1:6506)
at e (eval at webpackJsonp.308.module.exports (addScript.js:9), :1:897)
at Object.eval (eval at webpackJsonp.308.module.exports (addScript.js:9), :1:6967)
at e (eval at webpackJsonp.308.module.exports (addScript.js:9), :1:897)
at eval (eval at webpackJsonp.308.module.exports (addScript.js:9), :1:1281)
at eval (eval at webpackJsonp.308.module.exports (addScript.js:9), :1:1290)
at eval (eval at webpackJsonp.308.module.exports (addScript.js:9), :1:633)
at eval (eval at webpackJsonp.308.module.exports (addScript.js:9), :1:765)
at eval ()

How to fix this error? Thank's

observable combining

I'm submitting a ... (check one with "x")

[X] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior
The method getTitleWithPositioning combines the default/actual title together the application name on the client platform. However, combined values do not appear on the HTML source (server platform).

Expected/desired behavior
Same combination must appear both on server and the client platforms. The following steps will maintain the desired functionality:

• Combine observables with nested subscriptions (for server platform)
• Rewrite getTitleWithPositioning

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

warning found

Hi again !

I'm using the MetadataStaticLoader.

function createMetadataLoader() {
    return new MetadataStaticLoader({
        pageTitlePositioning: PageTitlePositioning.AppendPageTitle,
        pageTitleSeparator: '',
        applicationName: '',
        defaults: {
            title: 'Toto'
        }
    });
}

I've got this warning in my angular 2 webpack app with ng2-metadata. Do I have miss something ?
I'm in dev mod.

/src/app/app.module.ts
56:30 export 'PageTitlePositioning' was not found in 'ng2-metadata'
Error: export 'PageTitlePositioning' was not found in 'ng2-metadata'

export 'Meta' was not found in '@angular/platform-browser'

I have one angular-cli generated project where I want to use dynamic metadata for a page. I went ahead and used this module but its giving me the following issue.

WARNING in ./~/@nglibs/meta/src/meta.service.js
212:12-16 "export 'Meta' was not found in '@angular/platform-browser'

ERROR in /Users/<USERNAME>/projects/apps/business-template/open-business-webpage/node_modules/@nglibs/meta/src/meta.service.d.ts (1,10): Module '"/Users/<USERNAME>/projects/apps/business-template/open-business-webpage/node_modules/@angular/platform-browser/index"' has no exported member 'Meta'.
webpack: Failed to compile.

I am not using systemjs.config.

Current behavior
It is unable to find Meta class on @nglibs/meta/src/meta.service.js

Expected/desired behavior
It should allow the application to run successfully.

Minimal reproduction of the problem with instructions

• Start a new project using angular-cli 1.0.0-beta.28.3
• Add nglibs/meta package to your package.json
• Run npm install
• Add import { MetaModule, MetaLoader } from '@nglibs/meta'; on your app.module.ts.
• Add MetaModule.forRoot({ provide: MetaLoader }), on imports of app.module.ts
• Run ng serve

Please tell us about your environment:

• darwin x64

• IntelliJ 2017.1

• Node 6.9.5

• Angular version: 2.4.10

• Browser: Chrome

• Language: TypeScript

• Node (for AoT issues): node --version = 6.9.5

server-side rendering (universal) compability

I'm submitting a ... (check one with "x")

[ ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[X] feature request

Current behavior
Nor by viewing the page source, neither by sharing the page on facebook/twitter/etc, the dynamically generated meta tags by @nglibs/meta are revealed. These meta tags can only be viewed using developer tools on the browser.

Expected/desired behavior
Dynamically generated meta tags should be visible on the page source, as well as they should be readable by sharing the page on web/social networks/etc.

Minimal reproduction of the problem with instructions

• #14
• #13
• #11
• #9
• #5
• #4
• #1

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

remove manual & deferred initialization

I'm submitting a ... (check one with "x")

[ ] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[X] feature request

Current behavior
@nglibs/meta does not need anymore manual & deferred initialization as the meta tag generation is triggered by the MetaGuard.

Expected/desired behavior
The following steps will maintain the desired functionality:

• Remove deferred initialization (no longer needed)
• Remove manual initialization (no longer needed)
• Remove documentation for deferred initialization (no longer needed)

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

no page title & meta tags set when route contains no `meta`

I'm submitting a ... (check one with "x")

[X] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior
@nglibs/meta does not use the default page title when you start the Angular app on a route which does not contain meta property in route definitions.

Expected/desired behavior
The default page title and other meta tags must be displayed/rendered.

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

cannot set data programmatically when the string contains a variable inside a subscription method

I'm submitting a ... (check one with "x")

[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior

I'm doing this:

this.metadata.setTitle('Blog - ' + this.post.title);
this.metadata.setTag('og:description', `Blog - ${this.post.title}`);

But only the Blog - part gets set, the rest is just gone. I've checked a number of times and the value is not null, undefined or anything like that. Because it shows fine in the template also.

Expected/desired behavior
I expect the value not to be omitted.

Minimal reproduction of the problem with instructions
See current behavior.

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X
  2.3.1 (Cannot update to latest angular as of this time because of CLI)

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]
  All

• Language: [all | TypeScript X.X | ES6/7 | ES5]
  All

• Node (for AoT issues): node --version =
  6.7

using ng2-metadata in my angular-cli app and it doesnt work in an AOT build only in JIT build

I'm using ng2-metadata in my angular-cli app and it doesnt work in an AOT build only in JIT build.

I've made a stack overflow question: http://stackoverflow.com/questions/43395669/in-angular-cli-how-can-you-add-meta-data-to-routes-e-g-title-and-description-ta

How can I get this working in an AOT build.

add `yarn.lock` to npmignore

I'm submitting a ... (check one with "x")

[X] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior
The npm package contains yarn.lock file

Expected/desired behavior
yarn.lock file must be excluded from redistributable package.

Minimal reproduction of the problem with instructions

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 2.0.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

compile errors when using AOT compiling with ng2-metadata

I'm submitting a ... (check one with "x")

[X] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior
I currently using the module as follows:

import {NgModule} from '@angular/core';
//...
import {AppRoutes} from './app.routes';
import {MetadataModule} from 'ng2-metadata';

@NgModule({
    declarations: [
//...
    ],
    imports: [
//...
	RouterModule.forRoot(AppRoutes),
	MetadataModule.forRoot()
//...
    ],
    bootstrap: [AppComponent]
})
export class AppModule {
}

My AppRoutes contains metadata and works like a charm with JIT compilation, so I don't believe it to be faulty.

I also pass the service into AppComponent for dependency injection:

//...
constructor(private metadataService: MetadataService) {}
//...

Expected/desired behavior
Running the Angular CLI tool with the --aot parameter, should compile the app into an ahead-of-time compiled package, but instead it throws an error for the ng2-metadata package.

Minimal reproduction of the problem with instructions
Here's a repository set up with the angular-cli tool (ng new derp), substituting my current dependencies and tsconfig and adding the ng2-metadata code to the app module and app component.

https://github.com/JochemKuijpers/derp

Then run the ng build --aot command. This will fail even though JIT works without any problems.

The errors I'm seeing are:

WARNING in ./src/app/app.module.ngfactory.ts
335:44 export 'metadataLoaderFactory' (imported as 'import1') was not found in './app.module'

ERROR in ./src/app/app.module.ngfactory.ts
Module not found: Error: Can't resolve '../metadata.service' in '/home/jochem/repos/derp/src/app'
 @ ./src/app/app.module.ngfactory.ts 52:0-48
 @ ./src/main.ts
 @ multi main

What is the motivation / use case for changing the behavior?
I like to use ng2-metadata with my project but currently I cannot use it in my deployment (with AOT compiling)

Please tell us about your environment:
Ubuntu 16.04 LTS 64-bit

• Angular version: 2.2.3

I currently cannot upgrade to any newer version in my current project, so if the problem cannot be fixed in this Angular version, I may be forced to drop ng2-metadata.

• Browser: all

• Language: Typescript

• Node (for AoT issues): node --version = v7.3.0, npm --version = 3.10.10

new npm package @nglibs/meta no longer update title programmatically

[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior
I recently upgraded the package from @nglibs/metadata to @nglibs/meta: the following issues have been noticed:

• metaFactory defined and used in AppModule: only the title won't update if set programmatically. Title remains the default set from the factory.
• metaFactory not used in AppModule: title, description or other tags will not update programmatically.
• meta info defined in the routes will work as expected. (not an issue)

Here is code to test second issue, to test the first issue I just uncomment the commented code:
AppModule:

// export function metaFactory(): MetaLoader {
//     return new MetaStaticLoader({
//         pageTitlePositioning: PageTitlePositioning.PrependPageTitle,
//         pageTitleSeparator: ' - ',
//         applicationName: 'xxx xxxx some awesome company',
//         defaults: {
//             title: 'Default title',
//             description: 'Default description',
//             'og:image': '/images/common/the-logo.png',
//             'og:type': 'website',
//             'og:locale': 'en_CA',
//             'og:locale:alternate': 'en_US'
//         }
//     });
// }

@NgModule({
    imports: [
        ...,
        MetaModule.forRoot(),
        // MetaModule.forRoot({
        //     provide: MetaLoader,
        //     useFactory: (metaFactory)
        // }),
       ...,
    ],
    exports: [],
    declarations: [
        AppComponent
    ],
    bootstrap: [
        AppComponent
    ]
})

AppComponent:

export class AppComponent  {
    constructor(private readonly _meta: MetaService) { }
}

AboutComponent:

export class AboutComponent implements OnInit {
    constructor(private readonly _meta: MetaService) {
    }
    ngOnInit() {
        this._meta.setTitle('Page for test');                    // <-- no errors but title not set
        this._meta.setTag('description', 'Some description');    // <-- no errors but description tag not set
    }
}

Expected/desired behavior

No title and description set.
Note: I did not have any problems with the previous version: @nglibs/metadata

Please tell us about your environment:
Windows 7

• Angular version: 2.0.X

The app is develop with Meteor.js and Angular2, see below npm dependencies

"dependencies": {
    "@angular/common": "2.4.3",
    "@angular/compiler": "2.4.3",
    "@angular/core": "2.4.3",
    "@angular/forms": "2.4.3",
    "@angular/http": "2.4.3",
    "@angular/platform-browser": "2.4.3",
    "@angular/platform-browser-dynamic": "2.4.3",
    "@angular/router": "3.4.3",
    "@nglibs/meta": "^0.2.0-rc.3",
    "@types/chai": "^3.4.35",
    "@types/mocha": "^2.2.38",
    "@types/node": "^0.0.2",
    "angular2-file-drop": "^0.0.5",
    "angular2-meteor": "^0.7.1",
    "angular2-meteor-accounts-ui": "^1.0.0",
    "angular2-meteor-polyfills": "^0.1.1",
    "angular2-meteor-tests-polyfills": "^0.0.2",
    "babel-runtime": "^6.22.0",
    "bcrypt": "^1.0.2",
    "bootstrap": "^4.0.0-alpha.6",
    "dragula": "^3.7.2",
    "gm": "^1.23.0",
    "lodash": "^4.17.4",
    "meteor-node-stubs": "^0.2.4",
    "meteor-rxjs": "^0.3.0",
    "ng2-auto-complete": "^0.10.9",
    "ng2-dragula": "^1.3.0",
    "prerender-node": "^2.7.0",
    "reflect-metadata": "^0.1.10",
    "rxjs": "^5.2.0",
    "spawn-sync": "^1.0.15",
    "systemjs": "^0.19.42",
    "tether": "^1.4.0",
    "toastr": "^2.1.2",
    "try-thread-sleep": "^1.0.2",
    "tslib": "^1.6.0",
    "zone.js": "^0.7.4"
  }

Tested on Chrome only

setting og-tags

I'm submitting a ... (check one with "x")

[ ] bug report => check the README and search github for a similar issue or PR before submitting
[x ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Hi,
Sorry, I am not going to declare an issue, just a question (Don't know how to ask you about in other ways)

Can you tell me please, would this module help me to set og-tags (og:image , og:description, og:title) in such a way that facebook crawler (bot) will be able to scrape (read) these og-tags from the Shared URL , or the module is able to provide only Dynamic Title and description for page, when is accessed by humans, not bots ?

Thank you.

I hope I will have an answer, and after I'll read, I'll ping you to remove that question :)