Angular app with tweet button not showing full URL

[janephilipps]

I’m trying to add a tweet button to a page on my angular app. I want the button to share the page URL. I’ve inserted the tweet button with the following code:

<a href="https://twitter.com/share" class="twitter-share-button" data-via="janephilipps">Tweet</a>
  <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>

In production this only shares the base URL, not the full URL of the specific page. The via is also not showing up. I am using $routeprovider, which inserts a # after the base URL. Does anyone have a solution for this? Does it have to do with the # that is being inserted?

[niall]

Try explicitly setting url and via query parameters in the share link.
https://twitter.com/intent/tweet?text=Hello&url=https%3A%2F%2Fexample.com&via=janephilipps

Docs:
https://dev.twitter.com/web/tweet-button

[janephilipps]

Good suggestion, but unfortunately this won’t work for the URL portion because the page I’m adding the tweet button to is a template and has a unique URL (it includes a database ID) depending on the content.

[niall]