如何在Angular 2应用程序中嵌入javascript组件？

Question

在我的Angular 2应用程序中，我想嵌入这个＆＃34;标签输入组件＆＃34;这是用简单的Javacsript编写的：

https://github.com/yairEO/tagify

在我的打字稿中包含/嵌入它的正确方法是什么？

以下是我的文件片段，我希望该组件出现在其中：

我在Angular 2和Typescript的初级水平，但我希望我的问题有道理。

Answer 1

在index.html文件

中添加这些内容

<script src="jQuery.tagify.js"></script>
<link rel="stylesheet" type="text/css" href="tagify.css">

在您要使用tagify的组件中添加以下内容

declare var Tagify:any;

例如

import { Component } from '@angular/core';
declare var Tagify:any;
@Component({
  selector: 'my-app',
  template: `<h1>Hello {{name}}</h1>`
})
export class AppComponent { name = 'Angular'; }

然后在您的组件的ngAfterViewInit中添加tagify逻辑，例如

export class AppComponent implements AfterViewInit  { 
  name = 'Angular'; 
  ngAfterViewInit() {
    var input = document.querySelector('input[name=tags]'),
    tagify = new Tagify( input );
  }

}