在Angular 6中加载第三方库的问题

Question

加载第三方库的问题，这是依赖于另一个第三方库。就我而言，我正在使用bootstrap（v3.3.7），这是必需的JQuery。我按照角度建议的方式包含了这些库，并成功编译了应用程序，如果在浏览器中运行它会出现控制台错误。

版本

"dependencies": {
"@angular/animations": "^6.0.0",
"@angular/common": "^6.0.0",
"@angular/compiler": "^6.0.0",
"@angular/core": "^6.0.0",
"@angular/forms": "^6.0.0",
"@angular/http": "^6.0.0",
"@angular/platform-browser": "^6.0.0",
"@angular/platform-browser-dynamic": "^6.0.0",
"@angular/router": "^6.0.0",
"@types/bootstrap": "^3.3.33",
"@types/jquery": "^3.3.1",
"bootstrap": "^3.3.7",
"core-js": "^2.5.4",
"jquery": "3.3.1",
"malihu-custom-scrollbar-plugin": "3.1.5",
"rxjs": "^6.0.0",
"zone.js": "^0.8.26" }

示例代码和控制台错误

app.component.ts

import { Component, ElementRef, OnInit, AfterViewInit } from 
'@angular/core';
import * as $ from 'jquery';

@Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
   title = 'app'; 

   constructor(private element: ElementRef){ }
   ngOnInit() {
      $('.dropdown-toggle').dropdown();
   }
}

angular.json

"options": {
        "outputPath": "dist/ang6",
        "index": "src/index.html",
        "main": "src/main.ts",
        "polyfills": "src/polyfills.ts",
        "tsConfig": "src/tsconfig.app.json",
        "assets": [
          "src/favicon.ico",
          "src/assets"
        ],
        "styles": [
          { "input": "node_modules/bootstrap/dist/css/bootstrap.min.css" },
          { "input": "src/styles.css" }
        ],
        "scripts": [
          { "input": "node_modules/jquery/dist/jquery.js" },
          { "input": "node_modules/bootstrap/dist/js/bootstrap.min.js" }
        ]
      },

控制台错误

error_message_pic

角度6是否改变了加载/包含第三方库文件的方式？有谁可以帮我解决这个问题？