J'essaie d'utiliser le plug-in addthis JavaScript dans une application angularjs, mais il ne met pas à jour les icônes de plugin AddThis lorsque je charge une vue partielle avec NG-Vue. Si je rafraîchis la page, il fait (CTRL + F5). Je pense que AngularJs charge les vues partielles via Ajax an dans ce cas, AddThis ne montre pas les icônes sociales de la page chargée.
Ceci est le code d'index: P>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.4/angular.min.js"></script>
6 Réponses :
Vous allez probablement avoir besoin de placer les références de balises de script pour votre script Ajouter ce script dans votre partielle. Ce serait la solution la plus facile.
Ce qui se passe est à l'époque qu'ils sont couragés, le partiel n'a pas encore été chargé, alors ils n'affectent rien.
Bonjour Blesh, j'ai essayé de faire référence aux balises de script pour AddThis dans le partiel et ne fonctionne pas :-(. J'ai lu plus de personnes ayant cette question et jusqu'à présent, ils n'ont pas fondé de solution.
J'ai créé la simple directive angularjs pour rafraîchir la boîte à outils supplémentaires définie à l'intérieur de l'exemple Partial
<html>
<head>
<script src="//s7.addthis.com/js/300/addthis_widget.js#pubid=<my-pubid>&async=1"></script>
</head>
<body>
<!-- AddThis Button BEGIN -->
<div addthis-toolbox class="addthis_toolbox addthis_default_style addthis_32x32_style">
<a class="addthis_button_facebook"></a>
<a class="addthis_button_twitter"></a>
<a class="addthis_button_google_plusone_share"></a>
<a class="addthis_button_compact"></a>
<a class="addthis_counter addthis_bubble_style"></a>
<script type="text/javascript">var addthis_config = { "data_track_clickback": false, "data_track_addressbar":false };</script>
</div>
<!-- AddThis Button END -->
</body>
</html>
Je voulais ajouter un point supplémentaire à la réponse par Atonpinchuk. Un problème que nous avons eu dans notre application était que nous avions les boutons AddThis sur différentes pages et que l'URL et le titre varient en fonction de la page. Nous avons un service qui met à jour les balises Meta, mais parce que AddThis est initié avec le script de notre modèle principal, AddThis n'a pas pris la prise sur nos balises de méta modifiées.
Notre solution consistait à utiliser la configuration de partage dans notre directive, comme indiqué ici: http://support.addthis.com/customer/portal/articles/381263-addthis-client-api#configuration-sharing
De cette façon, AddThis ramasse la bonne URL et les titres. Bien sûr, si vous souhaitez imiter complètement les fonctionnalités de partage social d'une webiste latérale non client, il ne s'agit que de la moitié de la bataille. Vous auriez besoin d'écrire votre propre service pour mettre à jour les balises dans la tête. Ensuite, vous devez utiliser des phanomjs pour créer des versions statiques de votre site et rediriger Google, Facebook et d'autres agresseurs.
Un problème que nous rencontrons est que les boutons ne rendent pas dans IE8 pour une raison quelconque. Je n'ai pas encore compris une solution. La chose étrange est que cela fonctionne si vous appelez cela addthis.init () dans une balise de script via HTML mais cela ne fonctionnera pas pour un spa. Aussi addthis.init () est disponible (c'est-à-dire !! addthis.init () == vrai dans la directive, donc je ne sais pas ce qui ne va pas avec ça.
@ la solution d'Antonpinchuk a bien fonctionné pour moi, il ne met tout simplement pas à jour le comptoir ...
J'ai ajouté la ligne suivante à la fin de la directive et tout fonctionne comme un charme :)
Si vous utilisez la nouvelle configuration de Dashboard AddChis, vous pouvez simplement envelopper html:
Votre lien n'est plus valide, mais cela m'a sauvé, merci!
Je crois que c'est le lien mis à jour: addthis.com/academy/...
Merci, j'ai réussi à faire un composant angular2 basé sur cette idée pour obtenir ADDTHIS travaillant avec NG2 addthis.layers.refresh () (voir: http://www.addthis.com/academy/utrant-dashboard-configuration-tools-dynamiquement/ ) dans une directive et ajoutez à votre div.
3 commentaires
Essayez:
`<script type="text/javascript">
//always refresh on URL change
window.addEventListener("hashchange", function () {
addthis.layers.refresh();
});
</script>`
S'il vous plaît ajouter des explications. Votre réponse pourrait être marquée «de mauvaise qualité» et pourrait éventuellement être supprimée sans.