嗨,谢谢你的阅读.
我有一个角色应用程序正在制作和我偶然发现了一个问题.如此设置
index.html-
<html ng-app="myApp">
...
<div ng-view></div>
<div ng-include="'footer.html'"></div>
...
</html>
我不会打扰我的路线很简单/家是显示/home/index.html等等...
/home/index.html(当你来到网站时的默认视图)
<div class="responsive-block1">
<div class="tweet-me">
<h1> tweet me </h1>
</div>
<div class="twitter-box">
<twitter-timeline></twitter-timeline>
</div>
twitter时间线指令
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();
}
};
});
所以我刚刚使用twitter上的标签创建了一个基本的twitter指令.但是当我将视图示例更改为/ blog然后返回/ home时,twitter小部件根本不再呈现.
我也使用$ anchorScroll,如果我在页面上跳转到这个小部件也会消失.任何信息都会非常感谢.
我创建了一个Twitter小部件，并尝试将其放入Angular 2项目中，但JS文件不起作用。
如果我使用JS（在这里）插入它，则可以使用，但是当我切换到另一个选项卡并返回（我安装了Angular Routing）时，它消失了，并且显示了A标记中的内容（因此，“ Tweets by ...”）。
HTML代码（在home组件中）：
<md-card-content>
<a class="twitter-timeline" data-lang="en" data-height="350" data-theme="light" data-chrome="noborders nofooter noheader noscrollbar transparent" href="https://twitter.com/profile">Tweets by profile</a>
</md-card-content>
home.component.ts中的脚本，该代码由@ Arg0n提供（请看答案部分）：
import { Component, OnInit } from '@angular/core';
import { Router, NavigationEnd } from '@angular/router';
@Component({
selector: 'app-home',
templateUrl: './home.component.html',
styleUrls: ['./home.component.css']
})
export class HomeComponent implements OnInit {
constructor(private _router : Router) { }
public ngOnInit() {
this._router.events.subscribe(val => {
if (val instanceof NavigationEnd) {
(<any>window).twttr = (function (d, s, id) {
let …