当我更改视图时，Angular2不会加载外部js文件 [英] Angular2 don't load external js file when i change the view

问题描述

我仍在学习Angular 2，因此我在这里可能做错了什么.我有一个HTML/CSS模板，我正在尝试使其与Angular 2一起使用.我创建了一个Angular2项目，该项目的组件很少...

I am still learning Angular 2 so i may be doing something wrong over here. I have a HTML/CSS template and i am trying to make it work with Angular 2. I have created an Angular2 project with few components...

在app.component.html中，我有菜单

in the app.component.html i have my menu

<ul class="clearfix">
     <li><a [routerLink]="['/']">Home</a></li>
     <li><a [routerLink]="['/link1']">Link1</a></li>
     <li><a [routerLink]="['/link2']">Link2</a> </li>
</ul>

当我单击菜单项时，它会将视图更改为我制作的组件，例如，当我单击Link1时，它将向我显示index.html中的link1组件(link1.component.html)的视图

When i click on one item of the menu it changes the view to the component i made for example when i click Link1 it shows me the view of link1 component (link1.component.html) in the index.html i have

<app-root>Loading...</app-root> 

并且我已经加载了所有CSS和JS文件，所以这里的问题是，当我单击菜单上的视图更改时，但是Angular2不加载在index.html中加载的Javascript，仅当我将直接链接.

and i have loaded all the CSS and JS files, so the problem here when i click on the menu the view change but Angular2 do not load the Javascript that was loaded in index.html it only do that when i put the direct link.

更清楚地说，如果我将直接链接放置在浏览器localhost:4200/link1中，脚本将被加载，并且可以看到动画或我在index.html中加载并在link1.component中被调用的任何内容. .html，但如果我在家，然后单击菜单中的链接1"，则视图会更改，但是动画或警报...不起作用.

To be more clear if i put the direct link in the browser localhost:4200/link1 the script get loaded and i could see the animation or whatever i have that was loaded in the index.html and was called in link1.component.html but if i am at home and click Link 1 in the menu the view change but the animation or alert... doesn't work.

我在控制台和index.html中都没有收到任何错误，我只加载了这两个脚本

I don't get any error in the console and in the index.html i am only loading those two scripts

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script type="text/javascript" src="/assets/js/site.min.js"></script>

推荐答案

您可以在生命周期挂钩之一中运行jquery.

You can run the jquery inside one of the lifecycle hooks.

不确定哪种方法最好-您需要阅读文档，然后看看哪种方法可以满足您的需求.

Not sure which would be best - you'll need to read the documentation and see which fits your needs.

也许在ngAfterViewChecked之后.

Maybe after ngAfterViewChecked.

https://angular.io/docs/ts/latest/guide/lifecycle-hooks.html

export class Link1 implements ngAfterViewChecked {
    ngAfterViewChecked() {
        buildTree(){
    $('#FicheName_detailContent').height($('#NAMEsearch').height());
    if ($('#tvFicheName') != null) {
        $("#t_Search").val('');
        var isFull = $("ck_FullOrPartiell").checked;
        BuildTreeViewNAME($('#tvFicheName'), '', isFull, null);
     }
   }
}

(话虽这么说-您很有可能无需使用jquery就可以构建视图，而只需使用 有角的.)

(That being said - there's a good chance you can build the view without jquery just using angular.)

• 借口格式-在ipad上很棘手

这篇关于当我更改视图时，Angular2不会加载外部js文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！