Angular 2, twitter:player , twitter meta



I’m working with Angular 2 and I’m trying to implement twitter play card with audio.

I got two approaches , all fails

  1. All tags are hard coded eg.
    meta content=‘text/html; charset=UTF-8’ http-equiv='Content-Type’
    meta name=“twitter:card” content=“player"
    meta name=“twitter:site” content=”@rchoi"
    meta name=“twitter:title” content="Sample Player Card"
    meta name=“twitter:description” content="This is a sample video. When you implement, make sure all links are secure."
    meta name=“twitter:image” content=""
    meta name=“twitter:player” content=""
    meta name=“twitter:player:width” content="480"
    meta name=“twitter:player:height” content="480"
    meta name=“twitter:player:stream” content=""
    meta name=“twitter:player:stream:content_type” content=“video/mp4”

and using the service I tried to push data to, but it gets ‘undefined’

All meta tags are creating dynamically with , i tried several options

  • simple js
  • using component with ngOninit() function
  • in component’s Constructor

all fails.

Do you have any idea to make it works ?
Can I sent and receive data in container using twitter meta tags ?


The cards crawler cannot execute Javascript, so there’s no way to implement dynamic tags.

If you want someone to check a card for you we need a real URL to a hosted page.

There’s much more troubleshooting information in the pinned post to help you to debug on your own.


I found a workaroud.
Using angular2-cli after ‘ng build’ i replace index.html with index.php where i can take id of the item from url and then in twitter container I perform all logic for player.


using angular router i take ‘id’ from /audiocontainer/:id and do a logic here.

closed #4

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.