Javascript Angular 2中的第三方库

我在我的项目中添加了一个第三方包（jquery、colorbox）。首先，我在npm上安装了throw，然后添加到“angular cli.json”

我在组件中声明

declare var $:any;
declare var colorbox:any;
and the code

ngAfterViewInit(){
    $(document).ready(function(){
      $(".alma1").colorbox({rel:'alma1'});
    });
}

那景色呢

<a class="alma1" href="{‌{pic.pictureURL}}" title="{‌{pic.desc}}">
    <img class="alma" src="{‌{pic.pictureURL}}" alt="{‌{pic.desc}}">    
</a>

当我第一次点击链接时，它会将我带到google firebase存储链接页面，然后当我返回网页并再次点击链接时，colorbox软件包工作正常。我在ngAfterViewInit（）中调用了，但它看起来不存在。

---

为什么第一次不工作？

您需要使用一个加载程序将jQuery库传递给您的angular 2项目。此外，还需要确保jquery类型在传输文件时可用

您可以使用systemjs loader并在系统配置中在配置中添加jquery路径，这样您的类型脚本就会理解jquery

---

如果您将使用systemjs loader，它也将在浏览器中提供

在Angular2 CLI中我在哪里可以找到systemjs？它应该在webpack中，因为我找不到webpack config。是的，它在beta 14之后被删除。你可以自己实现它。它是分开的。如果您使用的是angular cli，则它应自动hppen

<a class="alma1" href="{‌{pic.pictureURL}}" title="{‌{pic.desc}}">
    <img class="alma" src="{‌{pic.pictureURL}}" alt="{‌{pic.desc}}">    
</a>