Angular4在组件负载上清除外部脚本

Question

我正在尝试在Angular4上重写我的jQuery网站。在我的家庭组件中，我使用此功能加载了外部.js文件：

public loadScript(url) {
        console.log('preparing to load...')
        let node = document.createElement('script');
        node.src = url;
        node.type = 'text/javascript';
        document.getElementsByTagName('head')[0].appendChild(node);
}

它运行良好，直到我开始在页面之间导航为止。问题是每次加载脚本时，都会在网站的不同部分上应用动画，因此当我在某个地方导航并返回动画时，将动画应用了两次，这看起来很奇怪。

请为那些是Angular专家的人，请不要建议我完全重写Angular。

我的问题是，如何刷新或冲洗所有先前加载的JS 对组件负载的影响？

有可能吗？如果是，您可以建议我。

我的第二个问题是什么原因？是jQuery层 完全与角度分开？

ps。我尝试了其他外部脚本加载的方法，但所有这些都以这种方式最终。如果我想快速将我的现有小型项目转换为Angular。

，这种方法非常有用。

更新1：脚本已加载在OnafterViewinit((中，因此： this.__dataservice.loadscript('/assets/js/home.js'(;

我无法访问功能，但动画和效果应用于元素，这足以满足我的目标。

Answer 1

基本上我发现了一个简单的解决方案。每次加载组件时，我都会生成一个随机的uuid号码，然后将其应用于我的HTML标签。然后，当加载外部脚本时，它不会影响我的当前元素，并且一切都正确显示。

外部JS：

function textLoader(uid) {
    var u = $("div."+uid+"[id^='block-']").hide(),
    h = 0;
    if (function d() {
        $("."+uid+" .text-block").hide();
...

组件TS：

constructor(private _dataService : DataService, private userService : UserService)
    {
        console.log('home constructor');
        this.uuid = "cc_" + this._dataService.getUUID();
    ...
ngAfterViewInit() {
        this._dataService.loadScript('/assets/js/home.js');     
        textLoader(this.uuid);

如果您对我的方法或任何其他可能的解决方案有个人看法，我很高兴听到它。我只是Angular2中的中间知识，当然不建议这样的代码。