将外部JS文件添加到Angular 5 CLI

Question

我只有一个Javascript函数：

function sidemodalclose() {
    $("#sidemodal").modal('hide');
    var date = new Date();
    date.setDate(date.getDate() + 1);
    document.cookie = "visited=yes; path=/; expires=" + date.toUTCString();
    console.log(document.cookie);
}

我想将其添加到Angular应用程序的home组件中。

由于我的home.component.ts有一些jQuery函数，需要访问sidemodalclose()函数。

import { Component, OnInit } from '@angular/core';

declare var $:any;

@Component({
    selector: 'app-home',
    templateUrl: './home.component.html',
    styleUrls: ['./home.component.scss']
})
export class HomeComponent implements OnInit {

    constructor() { }

    ngOnInit() {

        $("#no-thanks").click(function() {
            sidemodalclose();
        });

        if (document.cookie.indexOf("visited") == -1) {
            setTimeout(function() {
                $("#sidemodal").modal('show');
            }, 1000)
        }

        $("#submit3").click(function() {
            $("#submit3").html("Just a sec!");
            $.post("https://thirdparty.com/api.php", $("#contact3").serialize(), function(response) {
                $("#submit3").html(response);
            });
            return false;
        });
    }

}

我的问题是在应用程序中包含小型JS函数的最佳方法是什么？

1. 是否可以在.ts中内联添加JS函数？

2. 如果我import { SideModal } from '../../assets/js/sidemodal.js';导入JS文件import { SideModal } from '../../assets/js/sidemodal.js'; 为什么这样说， but '--allowJs' is not set. ？

3. 在Angular打字稿文件中包含自定义JS函数的最佳实践是什么？

欢迎有任何见识。 谢谢。

Answer 1

如果您可以在组件内部声明函数，那么所有问题都将得到解决。 您可以像使用此组件的任何其他功能一样使用

如果不能，那么最好的方法是将其添加到标记脚本下的.angular-cli.json文件中，以便cli在加载应用包之前为您加载。

并在类型脚本中使用它，您应该在@Types下搜索Definition Type或编写自己的类型文件。

一旦您的类型可用：

import {sidemodalclose} from 'your-type';