如果我在 angularjs 中更改视图，为什么我的 twitter 小部件不会呈现? [英] Why will my twitter widget not render if i change the view in angularjs?
问题描述
您好，感谢阅读.
我正在制作一个有角度的应用程序，我偶然发现了一个问题.设置成这样
index.html-
...<div ng-view></div><div ng-include="'footer.html'"></div>...</html>我不会打扰我的路线，它非常简单的/home 是显示/home/index.html 等等...
/home/index.html(进入站点时的默认视图)
<div class="tweet-me"><h1>推特我 </h1><div class="twitter-box"><twitter-timeline></twitter-timeline>
推特时间线指令
directives.directive("twitterTimeline", function() {返回 {限制:'E'，模板:'<a class="twitter-timeline" href="https://twitter.com/NAME" data-widget-id="XXXXXXXXXXXXXX">@NAME的推文</a>',链接:函数(范围，元素，属性){函数运行(){(!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"));console.log('运行脚本');};跑();}};});所以我刚刚使用来自 twitter 的标签创建了一个基本的 twitter 指令.但是当我将视图示例更改为/blog 然后返回/home 时，twitter 小部件根本不再呈现.
我也在使用 $anchorScroll，如果我用这个跳转到页面上，小部件也会消失.任何信息都会非常感谢.
请参阅此帖子:https://dev.twitter.com/讨论/890
我认为您可以通过调用来重新渲染小部件twttr.widgets.load().
如果您发现这不起作用，则需要将此代码包装到控制器中的 $timeout 中:
controller('MyCtrl1', ['$scope', '$timeout', function ($scope, $timeout) {$timeout = twttr.widgets.load();}])Hi and thanks for reading.
I have a angular app im making and ive stumbled on a problem. set up as so
index.html-
<html ng-app="myApp">
...
<div ng-view></div>
<div ng-include="'footer.html'"></div>
...
</html>
I wont bother putting my routes its pretty simple /home is shows the /home/index.html and so on...
/home/index.html (default view when you come to the site)
<div class="responsive-block1">
<div class="tweet-me">
<h1> tweet me </h1>
</div>
<div class="twitter-box">
<twitter-timeline></twitter-timeline>
</div>
twitter timeline directive
directives.directive("twitterTimeline", function() {
return {
restrict: 'E',
template: '<a class="twitter-timeline" href="https://twitter.com/NAME" data-widget-id="XXXXXXXXXXXXXX">Tweets by @NAME</a>',
link: function(scope, element, attrs) {
function run(){
(!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"));
console.log('run script');
};
run();
}
};
});
So I have just created a basic twitter directive using the tag from twitter. But when I change the view example to /blog then go back to /home the twitter widget no longer renders at all.
Im also using an $anchorScroll and if i jump to anyway on the page with this the widget also disappears. Any info would be great thanks.
See this post: https://dev.twitter.com/discussions/890
I think that you may be able to get the widget to re-render by calling twttr.widgets.load().
If you find that this does not work, you will need to wrap this code into $timeout in your controller:
controller('MyCtrl1', ['$scope', '$timeout', function ($scope, $timeout) {
$timeout = twttr.widgets.load();
}])
这篇关于如果我在 angularjs 中更改视图，为什么我的 twitter 小部件不会呈现?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
