步骤1

npm install jssha --save [using jssha for this demo]
It it is your own custom file place it in the scripts array of angular-cli.json skip this step 1

第二步

Add the jssha scripts file in .angular-cli.json file
"scripts": [ "../node_modules/jssha/src/sha.js" ]
Step three Adding a var in component to be used as a global variable

//using external js modules in Angular Component
declare var jsSHA: any; // place this above the component decorator
shaObj:any;
hash:string;
this.shaObj = new jsSHA("SHA-512", "TEXT");
this.shaObj.update("This is a Test");
this.hash = this.shaObj.getHash("HEX")

看看@这个链接。它有一个有效的示例，并提供了一个有关键入是否不包含示例的问题。我在该项目中使用了Angular的bootstrap和jquery，您也可以检查存储库。

在您的情况下，您需要添加jquery文件

像这样在你的angular-cli.json中

  "styles": [
    "../node_modules/bootstrap-v4-dev/dist/css/bootstrap.min.css",
    "styles.css"
  ],
  "scripts": [
    "../node_modules/jquery/dist/jquery.js",
    "../node_modules/tether/dist/js/tether.min.js",
    "../node_modules/bootstrap-v4-dev/dist/js/bootstrap.min.js"

然后在component中声明。declare var $: any;

这应该工作。

更新

我继续使用我提到的步骤，仅使用Angular中的jquery创建了一个引导模式。

它起作用检查此gh页面链接-LINK。

如果您要检查源代码是否相同，请检查LINK。

我发布的答案来自此链接，这是我在Angular LINK上的页面

您可以使用命令ng eject让Angular CLI生成webpack.config文件。

然后像以前一样将jQuery公开为变量。

我没有专门在Angular 2中使用Bootstrap，但是我在Angular 1中使用，情况是一样的，因为常规版本的Bootstrap设计为可与jQuery一起使用，而并非为Angular构建的。您当然可以安装jQuery，但是Javascript可能无法在Angular的上下文中正常工作。

最简单的解决方案是使用考虑到Angular构建的版本，我相信ng-bootstrap是其中最突出的版本。我自己没有使用过，但是我为Angular 1使用了angular-ui-bootstrap，这似乎是同一项目的Angular 2对应版本。

另外，您也可以自己将其包装在指令中，但是如果您可以让ng-bootstrap做您想做的事，我会避免这样做，因为这样做会做更多的工作。