从Angular4组件

Question

我很难在网络应用程序I＆＃39;中从外部 Javascript文件（称为roadmap.js）调用函数表达式。使用 Angular4 和angular-cli进行开发。 Roadmap.js基于d3.js，可在公共Github仓库中使用。

现在，我有：

1. 通过npm
安装了d3和@ types / d3
2. 将roadmap.js文件放入我的资产文件夹中，然后将其调整为隔离解析函数
3. 在roadmap.component.ts中导入d3
4. 声明解析，我希望在我的组件中调用的函数，作为ts文件顶部的任何var
5. 在ngOnInit（）
中调用该函数

roadmap.component.ts

declare var parse: any;

import { Component, OnInit } from '@angular/core';
import { DataService } from '../../../services/data/data.service';
import * as d3 from 'd3';
import '../../../../assets/js/roadmap.js';
@Component({
  selector: 'roadmap',
  templateUrl: './roadmap.component.html'
})

export class RoadmapComponent implements OnInit {
    constructor(private dataService: DataService){}
    ngOnInit() {
        new parse(); // Here is the function I'd like to call. It's defined 
                     // in roadmap.js file
    }
}

roadmap.js

// Code before this
var parse = function() {
    // Tasks
    var colors = d3.scale.category20();
    // More code 
};
// Code after this

我没有收到编译器的错误，但在我的浏览器控制台中，我可以看到函数解析未定义 - ＆gt; 错误：未捕获（在承诺中）：ReferenceError：未定义解析 ReferenceError：未定义解析

那我错过了什么？ N.B ：我的修改版本的roadmap.js正在开发一个经典的html / js网站，所以这个问题不应该来自那个js文件。